/* Guap Media — spacing, layout and breakpoints (values from the website CSS). */
:root {
  /* Layout */
  --gm-container-max: 1130px; /* @kind spacing */          /* .container, .container-4, .container-7 */
  --gm-page-offset-top: 80px; /* @kind spacing */          /* .page-content padding-top (fixed header) */
  --gm-section-pad-y: 80px; /* @kind spacing */            /* .section 80px 5%; ≤479 60px */
  --gm-section-pad-x: 5%; /* @kind spacing */
  --gm-section-pad-y-479: 60px; /* @kind spacing */
  --gm-hero-inner-pad-y: 60px; /* @kind spacing */         /* .hero.inner-pages; ≤767 45px; ≤479 35px */
  --gm-hero-home-pad-y: 120px; /* @kind spacing */         /* .hero.second */

  /* Header */
  --gm-nav-height: 80px; /* @kind spacing */               /* inner pages (inline style), white background */
  --gm-nav-height-home: 110px; /* @kind spacing */         /* home at scroll top: padding 30px 5% 10px, transparent */
  --gm-nav-pad-x: 2%; /* @kind spacing */                  /* .navigation; ≤991 5% */
  --gm-nav-min-height-991: 90px; /* @kind spacing */
  --gm-nav-min-height-479: 75px; /* @kind spacing */

  /* Grid gaps */
  --gm-gap-hero: 100px; /* @kind spacing */                /* .hero-grid, .grid-2-columns */
  --gm-gap-pricing: 32px; /* @kind spacing */              /* .pricing-grid */
  --gm-gap-services: 16px; /* @kind spacing */             /* .services-block-grid, .w-layout-grid */
  --gm-gap-blog: 30px; /* @kind spacing */                 /* .blog-grid */
  --gm-gap-testimonials: 10px; /* @kind spacing */
  --gm-gap-team: 10px; /* @kind spacing */
  --gm-gap-footer-cols: 300px; /* @kind spacing */         /* .footer-grid column gap; rows 50px */
  --gm-gap-footer-rows: 50px; /* @kind spacing */
  --gm-gap-footer-options: .75rem; /* @kind spacing */
  --gm-gap-chips: .438rem; /* @kind spacing */             /* .service_benefits */
  --gm-gap-chip-inner: .375rem; /* @kind spacing */        /* icon ↔ label inside .sb_lane */
  --gm-gap-hero-cta: 1.5rem; /* @kind spacing */           /* .meta-tag-flex-3 */
  --gm-gap-badges: 10px; /* @kind spacing */               /* .div-block-55 */
  --gm-gap-feature-list: 10px; /* @kind spacing */         /* .feature-grid row gap */
  --gm-gap-brand: .625rem; /* @kind spacing */             /* logo ↔ divider ↔ "Digitální agentura" */
  --gm-gap-cfg: 1rem; /* @kind spacing */

  /* Spacing scale actually used by the site (px) */
  --gm-space-3: 3px; /* @kind spacing */
  --gm-space-5: 5px; /* @kind spacing */
  --gm-space-10: 10px; /* @kind spacing */
  --gm-space-15: 15px; /* @kind spacing */
  --gm-space-16: 16px; /* @kind spacing */
  --gm-space-20: 20px; /* @kind spacing */
  --gm-space-25: 25px; /* @kind spacing */
  --gm-space-30: 30px; /* @kind spacing */
  --gm-space-35: 35px; /* @kind spacing */
  --gm-space-40: 40px; /* @kind spacing */
  --gm-space-45: 45px; /* @kind spacing */
  --gm-space-50: 50px; /* @kind spacing */
  --gm-space-60: 60px; /* @kind spacing */
  --gm-space-80: 80px; /* @kind spacing */
  --gm-space-90: 90px; /* @kind spacing */
  --gm-space-100: 100px; /* @kind spacing */

  /* Component paddings */
  --gm-pad-button: 16px 26px; /* @kind spacing */          /* .button-primary */
  --gm-pad-button-thin: 10px 26px; /* @kind spacing */     /* .thin */
  --gm-pad-button-thinner: 12px 26px 13px; /* @kind spacing */ /* .black.thinner */
  --gm-pad-button-small: 10px 15px; /* @kind spacing */    /* .small (cookie bar) */
  --gm-pad-button-hero: 16px 22px; /* @kind spacing */     /* .button-primary-3 */
  --gm-pad-chip: .313rem .75rem .375rem; /* @kind spacing */
  --gm-pad-tag: 9px 17px; /* @kind spacing */
  --gm-pad-breadcrumb: 6px 13px; /* @kind spacing */
  --gm-pad-service-block: 35px 25px 35px 33px; /* @kind spacing */
  --gm-pad-pricing-card: 45px 25px 25px; /* @kind spacing */
  --gm-pad-pricing-card-wide: 40px 45px; /* @kind spacing */
  --gm-pad-testimonial: 30px; /* @kind spacing */
  --gm-pad-footer-card: 1rem; /* @kind spacing */
  --gm-pad-cookies: 20px 30px 20px 22px; /* @kind spacing */
  --gm-pad-tooltip: .563rem .875rem; /* @kind spacing */

  /* Breakpoints (for reference — CSS media queries cannot read custom properties) */
  --gm-bp-tablet: 991px; /* @kind spacing */               /* max-width */
  --gm-bp-mobile-landscape: 767px; /* @kind spacing */     /* max-width */
  --gm-bp-mobile: 479px; /* @kind spacing */               /* max-width */
  --gm-bp-desktop-l: 1280px; /* @kind spacing */           /* min-width — project tile type */
  --gm-bp-desktop-xl: 1440px; /* @kind spacing */          /* min-width */
  --gm-bp-desktop-xxl: 1920px; /* @kind spacing */         /* min-width — 2100px rounded work band */
}
