/* Guap Media — colour tokens. Every value is copied from the new website's CSS (snapshot 2026_10_19_port_01). */
:root {
  /* The site's own :root variables (names kept, prefixed --gm-). Several are declared but barely used. */
  --gm-black-2: #121217; /* @kind color */
  --gm-dim-grey-2: #414147; /* @kind color */
  --gm-dim-grey: #414147; /* @kind color */
  --gm-gainsboro: #e0e0e0; /* @kind color */
  --gm-6fe6d2: #6fe6d2; /* @kind color */
  --gm-dim-grey-3: #707070; /* @kind color */
  --gm-dim-grey-4: #6e6e6e; /* @kind color */
  --gm-tomato: #dd643d; /* @kind color */
  --gm-alice-blue: #eef7ff; /* @kind color */
  --gm-silver: #c7c4c4; /* @kind color */
  --gm-black: #291209; /* @kind color */
  --gm-medium-purple: #9979d9; /* @kind color */
  --gm-light-steel-blue: #a1c4e4; /* @kind color */
  --gm-dodger-blue-hover: #3898ec; /* @kind color */
  --gm-alice-blue-section: #e0f0ff; /* @kind color */

  /* Neutrals */
  --gm-white: #fff; /* @kind color */
  --gm-black-pure: #000; /* @kind color */
  --gm-ink-111: #111; /* @kind color */
  --gm-ink-121212: #121212; /* @kind color */
  --gm-ink-0a0a0a: #0a0a0a; /* @kind color */
  --gm-ink-313131: #313131; /* @kind color */
  --gm-ink-444: #444; /* @kind color */
  --gm-grey-666: #666; /* @kind color */
  --gm-grey-747474: #747474; /* @kind color */
  --gm-grey-868686: #868686; /* @kind color */
  --gm-grey-8d8d8d: #8d8d8d; /* @kind color */
  --gm-line-e1e1e1: #e1e1e1; /* @kind color */
  --gm-line-eee: #eee; /* @kind color */
  --gm-line-f0f0f0: #f0f0f0; /* @kind color */
  --gm-line-e4e4e4: #e4e4e4; /* @kind color */
  --gm-surface-f6f6f6: #f6f6f6; /* @kind color */
  --gm-surface-f7f7f7: #f7f7f7; /* @kind color */
  --gm-surface-fafafa: #fafafa; /* @kind color */
  --gm-surface-f4f4f4: #f4f4f4; /* @kind color */
  --gm-surface-ececec: #ececec; /* @kind color */

  /* Semantic aliases — text */
  --gm-text-default: var(--gm-black-2); /* @kind color */        /* body colour */
  --gm-text-heading: var(--gm-black-pure); /* @kind color */     /* display-1, display-2, hero */
  --gm-text-body: var(--gm-dim-grey-2); /* @kind color */        /* paragraphs, subheads */
  --gm-text-eyebrow: var(--gm-grey-868686); /* @kind color */    /* sub-small-title */
  --gm-text-meta: var(--gm-grey-747474); /* @kind color */       /* blog category, read time, floating labels */
  --gm-text-feature: var(--gm-dim-grey-3); /* @kind color */     /* pricing feature list */
  --gm-text-quote: var(--gm-grey-666); /* @kind color */         /* testimonial quote + company */
  --gm-text-quote-name: var(--gm-ink-444); /* @kind color */
  --gm-text-blog-title: #12141d; /* @kind color */
  --gm-text-footnote: var(--gm-grey-8d8d8d); /* @kind color */   /* "Všechna řešení stavíme…" */
  --gm-text-on-dark: var(--gm-white); /* @kind color */
  --gm-text-on-dark-muted: #ffffffb3; /* @kind color */          /* footer nav, copyright */
  --gm-text-footer-contact: var(--gm-alice-blue); /* @kind color */ /* footer e-mail + phone */
  --gm-text-features-label: #000000b3; /* @kind color */         /* "Specializujeme se na ->" */

  /* Semantic aliases — surfaces */
  --gm-surface-page: var(--gm-white); /* @kind color */
  --gm-surface-home: linear-gradient(90deg, #ececec, #fafafa 67%, #fff 85%, #fafafa); /* @kind color */
  --gm-surface-inner-hero: var(--gm-surface-f7f7f7); /* @kind color */
  --gm-surface-soft: var(--gm-surface-fafafa); /* @kind color */  /* service blocks, hero chips, trust badges */
  --gm-surface-gray: var(--gm-surface-f6f6f6); /* @kind color */  /* default button, section.gray */
  --gm-surface-card: var(--gm-white); /* @kind color */           /* pricing cards, testimonials */
  --gm-surface-dark: var(--gm-ink-111); /* @kind color */         /* footer CTA band, "Začít svůj projekt" band */
  --gm-surface-work-fade: linear-gradient(163deg, #f7f7f700, #fff 26%, #fff); /* @kind color */

  /* Borders and lines */
  --gm-color-border-hairline: var(--gm-line-e1e1e1); /* @kind color */  /* section heading rule, team cells */
  --gm-color-border-card: var(--gm-line-eee); /* @kind color */         /* pricing card */
  --gm-color-border-button: var(--gm-line-f0f0f0); /* @kind color */
  --gm-color-border-input: var(--gm-line-e4e4e4); /* @kind color */
  --gm-color-border-image: #f5f5f5; /* @kind color */                   /* 2px frame on pricing screenshots */
  --gm-divider-hero: #aaa3; /* @kind color */
  --gm-divider-footer: #e1e1e11c; /* @kind color */

  /* Buttons */
  --gm-button-bg: var(--gm-surface-f6f6f6); /* @kind color */
  --gm-button-text: var(--gm-ink-121212); /* @kind color */
  --gm-button-hover-bg: var(--gm-ink-0a0a0a); /* @kind color */
  --gm-button-hover-text: var(--gm-white); /* @kind color */
  --gm-button-black-bg: var(--gm-ink-313131); /* @kind color */
  --gm-button-black-gradient: linear-gradient(169deg, #2c2c2c, #2c2c2c 46%, #000); /* @kind color */
  --gm-button-black-hover-bg: var(--gm-ink-444); /* @kind color */
  --gm-button-hero-bg: var(--gm-black-pure); /* @kind color */
  --gm-button-white-text: var(--gm-dim-grey-2); /* @kind color */
  --gm-button-white-hover-bg: var(--gm-dim-grey-2); /* @kind color */
  --gm-button-white-hover-text: var(--gm-surface-ececec); /* @kind color */
  --gm-button-outline-dark-text: #bababa; /* @kind color */
  --gm-button-outline-dark-border: #282828cc; /* @kind color */

  /* Hero rotating words + hover accent */
  --gm-accent-green: #2aa52e; /* @kind color */   /* "webové stránky" */
  --gm-accent-rust: #bc4b22; /* @kind color */    /* "internetové obchody" */
  --gm-accent-amber: #d27b23; /* @kind color */   /* "online marketing" */
  --gm-accent-hover: var(--gm-tomato); /* @kind color */ /* hero word hover, footer-link.sad hover */

  /* Benefit chips (.sb_lane) — text / background / border */
  --gm-chip-text: #2e2e34; /* @kind color */          --gm-chip-bg: #f8f8f8; /* @kind color */          --gm-chip-border: #ebebeb; /* @kind color */
  --gm-chip-blue-text: #113d51; /* @kind color */     --gm-chip-blue-bg: #f4f8f9; /* @kind color */     --gm-chip-blue-border: #d9edf3; /* @kind color */
  --gm-chip-green-text: #115115; /* @kind color */    --gm-chip-green-bg: #f5f9f4; /* @kind color */    --gm-chip-green-border: #def3d9; /* @kind color */
  --gm-chip-yellow-text: #6c6d15; /* @kind color */   --gm-chip-yellow-bg: #fffef6; /* @kind color */   --gm-chip-yellow-border: #f3f1d9; /* @kind color */
  --gm-chip-purple-text: #4d1151; /* @kind color */   --gm-chip-purple-bg: #f9f4f9; /* @kind color */   --gm-chip-purple-border: #f2e8f4; /* @kind color */
  --gm-chip-orange-text: #115051; /* @kind color */   --gm-chip-orange-bg: #f4f9f9; /* @kind color */   --gm-chip-orange-border: #d9f1f3; /* @kind color */ /* named "orange" in the site, renders teal */
  --gm-chip-red-text: #511a11; /* @kind color */      --gm-chip-red-bg: #f9f8f8; /* @kind color */      --gm-chip-red-border: #f4e6e4; /* @kind color */

  /* Highlight spans (.onas_boldspan) on Kdo jsme */
  --gm-highlight-1-text: #054700; /* @kind color */ --gm-highlight-1-bg: linear-gradient(224deg, #34a62c14, #2da41a1f 39%, #2aa31314 69%, #0d840414); /* @kind color */
  --gm-highlight-2-text: #470027; /* @kind color */ --gm-highlight-2-bg: linear-gradient(224deg, #b744831f, #b744830f 39%, #b744831c 69%, #b744830d); /* @kind color */
  --gm-highlight-3-text: #000d47; /* @kind color */ --gm-highlight-3-bg: linear-gradient(224deg, #354cb21a, #354cb20f 39%, #354cb21a 69%, #354cb20d); /* @kind color */
  --gm-highlight-4-text: #471c00; /* @kind color */ --gm-highlight-4-bg: linear-gradient(224deg, #bc714029, #bc6f3c1f 39%, #bc714012 69%, #bc714026); /* @kind color */

  /* Feedback */
  --gm-success-bg: #3c8b50; /* @kind color */
  --gm-error-bg: #960707; /* @kind color */
  --gm-danger: #cd0000; /* @kind color */            /* configurator "Ano, přeskočit" */

  /* Footer (dark band) */
  --gm-footer-link-hover: #0dc6ff; /* @kind color */
  --gm-footer-copyright-hover: #ff8484; /* @kind color */
  --gm-footer-social-bg: #3d3d3d; /* @kind color */
  --gm-footer-card-bg: #ffffff08; /* @kind color */
  --gm-footer-card-border: var(--gm-ink-313131); /* @kind color */
  --gm-footer-card-hover-bg: #ffffff1a; /* @kind color */
  --gm-footer-card-hover-border: #535353; /* @kind color */
  --gm-footer-icon-border: #bebebe; /* @kind color */
  --gm-footer-card-text: #bcbcbc; /* @kind color */

  /* Tooltip */
  --gm-tooltip-bg: linear-gradient(124deg, #f8f8f8cc, #f1f1f1cc 26%, #fffc); /* @kind color */
  --gm-tooltip-outline: #e4e4e4; /* @kind color */
  --gm-tooltip-title: #1a1a1a; /* @kind color */
  --gm-tooltip-text: #4a4a4a; /* @kind color */

  /* Configurator */
  --gm-cfg-overlay: #272727d6; /* @kind color */
  --gm-cfg-card-bg: #fcfcfc; /* @kind color */
  --gm-cfg-card-border: #faf2f2; /* @kind color */
  --gm-cfg-outline: #e3e3e3; /* @kind color */
  --gm-cfg-step-border: #ebebeb; /* @kind color */
  --gm-cfg-submit-bg: #27292b; /* @kind color */
  --gm-cfg-submit-hover-bg: #3d4043; /* @kind color */
  --gm-cfg-submit-active-bg: #2a2e31; /* @kind color */
  --gm-cfg-secondary-bg: #f5f5f5; /* @kind color */
  --gm-cfg-secondary-text: #1e1e1e; /* @kind color */
  --gm-cfg-sub-text: #4a4a4a; /* @kind color */
  --gm-cfg-loading-text: #51515a; /* @kind color */
  --gm-cfg-tag-text: #004f7a; /* @kind color */  --gm-cfg-tag-bg: #f5f8ff; /* @kind color */  --gm-cfg-tag-border: #dae3f4; /* @kind color */
  --gm-cfg-tag-gray-text: #424242; /* @kind color */ --gm-cfg-tag-gray-bg: #fafafa; /* @kind color */ --gm-cfg-tag-gray-border: #efefef; /* @kind color */
  --gm-cfg-open-border: #dd643d4d; /* @kind color */
  --gm-cfg-card-overlay: #e0e0e0bf; /* @kind color */
  --gm-cfg-explainer-bg: linear-gradient(302deg, #0015ff, #242323 35%, #101010 52%, #333 69%, #ff1212); /* @kind color */
  --gm-cfg-explainer-outline: #eadcf6; /* @kind color */
  --gm-cfg-progress: linear-gradient(90deg, #dce6fc 0%, #c7d2e9 25%, #b6c9eb 50%, #c7d2e9 75%, #dce6fc 100%); /* @kind color */
  --gm-cfg-progress-border: #cbd3f4; /* @kind color */
  --gm-cfg-timeline-line: #e5e7eb; /* @kind color */
  --gm-cfg-timeline-text: #4b5563; /* @kind color */
}