/* Guap Media — typography tokens. Values copied from the website CSS; breakpoint values noted per role.
   Breakpoints: ≤991px tablet, ≤767px mobile landscape, ≤479px mobile (Webflow defaults). */
:root {
  /* Families. The site sets body { font-family: var(--font-manrope), sans-serif !important }:
     Manrope is the only face that renders; Inter is loaded but used only by <figcaption>. */
  --gm-font-manrope: "Manrope", "Manrope Fallback"; /* @kind font */
  --gm-font-inter: "Inter", "Inter Fallback"; /* @kind font */
  --gm-font-body: var(--gm-font-manrope), sans-serif; /* @kind font */
  --gm-font-caption: Inter, sans-serif; /* @kind font */

  /* Weights in use */
  --gm-weight-extralight: 200; /* @kind font */
  --gm-weight-light: 300; /* @kind font */
  --gm-weight-regular: 400; /* @kind font */
  --gm-weight-medium: 500; /* @kind font */
  --gm-weight-semibold: 600; /* @kind font */
  --gm-weight-bold: 700; /* @kind font */
  --gm-weight-extrabold: 800; /* @kind font */

  /* Body defaults (body): 14px / 20px / 600, colour #121217 */
  --gm-body-size: 14px; /* @kind font */
  --gm-body-line: 20px; /* @kind font */
  --gm-body-weight: 600; /* @kind font */

  /* Paragraph (p): 16px / 21px / 500, colour #414147 */
  --gm-p-size: 16px; /* @kind font */
  --gm-p-line: 21px; /* @kind font */
  --gm-p-weight: 500; /* @kind font */

  /* Home hero (.display-14): 59/58, 600, -0.5px — ≤767: 50/50 — ≤479: 32/35 */
  --gm-hero-size: 59px; /* @kind font */
  --gm-hero-line: 58px; /* @kind font */
  --gm-hero-weight: 600; /* @kind font */
  --gm-hero-tracking: -.5px; /* @kind font */
  --gm-hero-size-767: 50px; /* @kind font */   --gm-hero-line-767: 50px; /* @kind font */
  --gm-hero-size-479: 32px; /* @kind font */   --gm-hero-line-479: 35px; /* @kind font */

  /* Page title (.display-1): 3.75rem/58px, 600 — ≤767: 50/50 — ≤479: 35/35 */
  --gm-display-1-size: 3.75rem; /* @kind font */
  --gm-display-1-line: 58px; /* @kind font */
  --gm-display-1-weight: 600; /* @kind font */
  --gm-display-1-size-767: 50px; /* @kind font */  --gm-display-1-line-767: 50px; /* @kind font */
  --gm-display-1-size-479: 35px; /* @kind font */  --gm-display-1-line-479: 35px; /* @kind font */

  /* Section title (.display-2): 46/48, 600 — ≤767: 41/45 — ≤479: 34/36. ".heading" variant 46/46, ≤767 2.5rem/2.5rem.
     Article title (.display-8) uses the same values. */
  --gm-display-2-size: 46px; /* @kind font */
  --gm-display-2-line: 48px; /* @kind font */
  --gm-display-2-weight: 600; /* @kind font */
  --gm-display-2-size-767: 41px; /* @kind font */  --gm-display-2-line-767: 45px; /* @kind font */
  --gm-display-2-size-479: 34px; /* @kind font */  --gm-display-2-line-479: 36px; /* @kind font */

  /* .display-3 (Děkujeme, dark band): 38/40, 600 */
  --gm-display-3-size: 38px; /* @kind font */
  --gm-display-3-line: 40px; /* @kind font */

  /* Subhead (.subhead): 23/32, 400, #414147 — ≤479: 20/24. ".smaller": 20/25. Hero subhead (.subhead-7) 23/30. */
  --gm-subhead-size: 23px; /* @kind font */
  --gm-subhead-line: 32px; /* @kind font */
  --gm-subhead-weight: 400; /* @kind font */
  --gm-subhead-size-479: 20px; /* @kind font */  --gm-subhead-line-479: 24px; /* @kind font */
  --gm-subhead-small-size: 20px; /* @kind font */ --gm-subhead-small-line: 25px; /* @kind font */
  --gm-subhead-hero-line: 30px; /* @kind font */

  /* Eyebrow (.sub-small-title, h4/h2): 16px, 600, #868686, centred, h4 line 24px */
  --gm-eyebrow-size: 16px; /* @kind font */
  --gm-eyebrow-weight: 600; /* @kind font */

  /* Card / block titles */
  --gm-services-title-size: 18px; /* @kind font */     /* .services-title, 600 */
  --gm-pricing-type-size: 22px; /* @kind font */       /* .pricing-type, line 26px, 700 (h3) */
  --gm-pricing-type-line: 26px; /* @kind font */
  --gm-tab-title-size: 17px; /* @kind font */          /* .tab-title */
  --gm-faq-question-size: 20px; /* @kind font */       /* .toggle-header 600; ≤479 18px */
  --gm-blog-title-size: 26px; /* @kind font */         /* .blog-title 400 — ≤767 21/24 — ≤479 21/25 */
  --gm-blog-title-line: 30px; /* @kind font */
  --gm-project-title-size: 15px; /* @kind font */      /* .project-title.upgraded 500, 1.5 — ≥1280 18 — ≥1440 20 — ≥1920 24 */

  /* Buttons (.button-primary): 16px, 600 — ≤991: 12px/16px — ≤767: 1rem/1rem */
  --gm-button-size: 16px; /* @kind font */
  --gm-button-weight: 600; /* @kind font */
  --gm-button-size-991: 12px; /* @kind font */  --gm-button-line-991: 16px; /* @kind font */
  --gm-button-small-size: 15px; /* @kind font */
  --gm-button-outline-dark-size: .875rem; /* @kind font */ /* footer card buttons, 500 */

  /* Menu */
  --gm-menu-link-size: 40px; /* @kind font */          /* .nav-link 700, line 40px — ≤479 27px */
  --gm-menu-link-line: 40px; /* @kind font */
  --gm-menu-label-size: 14px; /* @kind font */         /* "MENU" / "ZPĚT": 700, uppercase */
  --gm-menu-label-tracking: 5px; /* @kind font */

  /* Small UI text */
  --gm-meta-size: 16px; /* @kind font */               /* blog category, read time — 500 */
  --gm-feature-size: 15px; /* @kind font */            /* pricing features — 500 */
  --gm-chip-size: 12px; /* @kind font */               /* .sb_lane — 500 */
  --gm-tag-size: 14px; /* @kind font */                /* hero/agency tags (.paragraph-no-margin) — 600 / 400 */
  --gm-quote-size: 19px; /* @kind font */              /* testimonial (.quote-text._2) 400 — ≤991 16/19 — ≤479 17/20 */
  --gm-quote-line: 22px; /* @kind font */
  --gm-person-size: 17px; /* @kind font */             /* testimonial + team names, 400; name 500 */
  --gm-footer-link-size: 16px; /* @kind font */        /* footer nav, 600 */
  --gm-copyright-size: 15px; /* @kind font */          /* line 14px, 500 */
  --gm-footer-card-title-size: 1rem; /* @kind font */  /* 700 */
  --gm-footer-card-text-size: .75rem; /* @kind font */ /* line 1.6, 500 */
  --gm-tooltip-title-size: 14px; /* @kind font */      /* 700, line 1.4 */
  --gm-tooltip-text-size: 12px; /* @kind font */       /* 400, line 1.5 */
  --gm-breadcrumb-size: 13px; /* @kind font */         /* 700; current 500 */
  --gm-cookies-size: 16px; /* @kind font */            /* 500 */

  /* Long-form */
  --gm-longform-line: 2.2; /* @kind font */            /* Jak to funguje / Kdo jsme text, legal lists (400) */
  --gm-richtext-h3-size: 24px; /* @kind font */        /* h3 30px line, 700 */
  --gm-richtext-h4-size: 18px; /* @kind font */        /* h4 24px line, 700 */
  --gm-blockquote-size: 30px; /* @kind font */         /* 600, line 30px, 2px left rule — ≤991 40/40 — ≤767 34/34 */

  /* Configurator */
  --gm-cfg-step-title-size: 16px; /* @kind font */     /* 800, 1.25 */
  --gm-cfg-card-title-size: 16px; /* @kind font */     /* 700, 1.5; big 20px */
  --gm-cfg-card-sub-size: 14px; /* @kind font */       /* 500, 1.7 */
  --gm-cfg-tag-size: 10px; /* @kind font */            /* 500, 1.2, .12px */
}
