@charset "UTF-8";

/* Gastro Kafe — společné produktové popisy, verze 2, 29. 9. 2026.
   NOVÉ POPISY: obal .gk-product, prvky .gkp-*.
   ZPĚTNÁ KOMPATIBILITA: stávající #gk-jura-e10 a .e10-* fungují také.
   Žádný import dalšího CSS, žádné globální změny šablony.
   Ve společném HEAD má být pouze jeden odkaz na tento soubor.
   Existující gastrokafe_28.css, chatbot, Euroleasing a landing pages neměnit.
*/


:is(.gk-product, #gk-jura-e10) {
  --gkp-ink: #0d0702;
  --gkp-muted: #624e44;
  --gkp-green: #7d9050;
  --gkp-green-dark: #52672d;
  --gkp-soft: #f3f6ea;
  --gkp-cream: #f7f6f2;
  --gkp-line: #dddcd4;
  box-sizing: border-box;
  container-type: inline-size;
  width: 100%;
  max-width: 1140px;
  min-width: 0;
  margin: 24px auto;
  padding: 0;
  color: var(--gkp-ink);
  background: #fff;
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  text-align: left;
  overflow-wrap: break-word;
}

:is(.gk-product, #gk-jura-e10) *,
:is(.gk-product, #gk-jura-e10) *::before,
:is(.gk-product, #gk-jura-e10) *::after {
  box-sizing: border-box;
}

:is(.gk-product, #gk-jura-e10) h2,
:is(.gk-product, #gk-jura-e10) h3 {
  margin: 0 0 18px;
  color: var(--gkp-ink);
  font-family: "Bebas Neue", "Arial Narrow", Arial, sans-serif;
  font-weight: 700;
  line-height: 1.16;
  letter-spacing: .015em;
  text-transform: none;
  overflow-wrap: break-word;
}

:is(.gk-product, #gk-jura-e10) h2 { font-size: clamp(27px, 3vw, 37px); }
:is(.gk-product, #gk-jura-e10) h3 { font-size: clamp(23px, 2.3vw, 28px); }
:is(.gk-product, #gk-jura-e10) p { margin: 0 0 17px; font-size: inherit; line-height: inherit; }
:is(.gk-product, #gk-jura-e10) p:last-child { margin-bottom: 0; }
:is(.gk-product, #gk-jura-e10) strong { color: inherit; font-weight: 700; }
:is(.gk-product, #gk-jura-e10) a { color: var(--gkp-green-dark); text-decoration: underline; text-underline-offset: 3px; }
:is(.gk-product, #gk-jura-e10) a:hover { color: var(--gkp-ink); }
:is(.gk-product, #gk-jura-e10) a:focus-visible { outline: 3px solid var(--gkp-green-dark); outline-offset: 5px; }
:is(.gk-product, #gk-jura-e10) img { display: block; float: none; width: auto; max-width: 100%; height: auto; margin: 0 auto; border: 0; }
:is(.gk-product, #gk-jura-e10) figure { min-width: 0; margin: 0; padding: 0; }
:is(.gk-product, #gk-jura-e10) figcaption { margin-top: 12px; color: var(--gkp-muted); font-size: 13px; line-height: 1.5; }
:is(.gk-product, #gk-jura-e10) [id] { scroll-margin-top: 100px; }

:is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  align-items: center;
  gap: 36px;
  padding: 36px;
  border-top: 4px solid var(--gkp-green);
  background: var(--gkp-cream);
}
:is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) > *,
:is(.gk-product, #gk-jura-e10) :is(.gkp-split, .e10-split) > *,
:is(.gk-product, #gk-jura-e10) :is(.gkp-worlds, .e10-worlds) > * { min-width: 0; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-eyebrow, .e10-eyebrow) {
  margin: 0 0 14px;
  color: var(--gkp-green-dark);
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .13em;
  text-transform: uppercase;
}
:is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) h2 { font-size: clamp(30px, 3.3vw, 43px); line-height: 1.08; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-lead, .e10-lead) { font-size: 18px; line-height: 1.6; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-hero-media, .e10-hero-media) { padding: 24px; background: #fff; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-hero-media, .e10-hero-media) img { width: 100%; max-width: 340px; max-height: 470px; object-fit: contain; }

:is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--gkp-line);
  list-style: none;
}
:is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li {
  min-width: 0;
  margin: 0;
  padding: 22px 18px;
  border-right: 1px solid var(--gkp-line);
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
  list-style: none;
}
:is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li:last-child { border-right: 0; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li::before { content: none; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) strong {
  display: block;
  margin-bottom: 5px;
  color: var(--gkp-green-dark);
  font-size: 23px;
  line-height: 1.25;
}

:is(.gk-product, #gk-jura-e10) :is(.gkp-section, .e10-section) { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--gkp-line); }
:is(.gk-product, #gk-jura-e10) :is(.gkp-section-intro, .e10-section-intro) { max-width: 820px; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-split, .e10-split) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 36px;
}
:is(.gk-product, #gk-jura-e10) :is(.gkp-split--reverse, .e10-split--reverse) :is(.gkp-media, .e10-media) { order: -1; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-media, .e10-media) { background: var(--gkp-cream); }
:is(.gk-product, #gk-jura-e10) :is(.gkp-media, .e10-media) img { width: 100%; object-fit: contain; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-worlds, .e10-worlds) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 36px; margin-top: 26px; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-world, .e10-world) { padding: 22px 0 0; border-top: 3px solid var(--gkp-green); }
:is(.gk-product, #gk-jura-e10) :is(.gkp-world, .e10-world) h3 { margin-bottom: 12px; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-world-label, .e10-world-label) { display: block; margin-bottom: 8px; color: var(--gkp-green-dark); font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-note, .e10-note) { margin: 22px 0; padding: 16px 20px; border-left: 3px solid var(--gkp-green); background: var(--gkp-soft); font-size: 14px; line-height: 1.6; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-note, .e10-note) p { margin: 0; }

:is(.gk-product, #gk-jura-e10) :is(.gkp-checks, .e10-checks) { margin: 16px 0 0; padding: 0 0 0 22px; list-style: disc outside; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-checks, .e10-checks) li { margin: 0 0 9px; padding: 0; line-height: 1.65; list-style: disc outside; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-checks, .e10-checks) li::before { content: none; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-checks, .e10-checks) li::marker { color: var(--gkp-green-dark); }

:is(.gk-product, #gk-jura-e10) :is(.gkp-table-wrap, .e10-table-wrap) { width: 100%; max-width: 100%; margin-top: 24px; }
:is(.gk-product, #gk-jura-e10) table {
  float: none;
  width: 100%;
  max-width: 100%;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  table-layout: fixed;
  background: #fff;
  font-size: 15px;
  line-height: 1.6;
}
:is(.gk-product, #gk-jura-e10) caption { padding: 0 0 14px; color: var(--gkp-muted); text-align: left; font-size: 14px; }
:is(.gk-product, #gk-jura-e10) th,
:is(.gk-product, #gk-jura-e10) td { padding: 13px 16px; border: 0; border-bottom: 1px solid var(--gkp-line); vertical-align: top; color: var(--gkp-ink); text-align: left; overflow-wrap: anywhere; }
:is(.gk-product, #gk-jura-e10) th { width: 39%; background: var(--gkp-cream); font-weight: 700; }
:is(.gk-product, #gk-jura-e10) td { background: #fff; }

:is(.gk-product, #gk-jura-e10) :is(.gkp-faq-item, .e10-faq-item) { padding: 24px 0; border-bottom: 1px solid var(--gkp-line); }
:is(.gk-product, #gk-jura-e10) :is(.gkp-faq-item, .e10-faq-item) h3 { margin-bottom: 12px; font-family: inherit; font-size: 18px; line-height: 1.4; letter-spacing: 0; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-faq-item, .e10-faq-item) p { margin-bottom: 0; }

:is(.gk-product, #gk-jura-e10) :is(.gkp-showroom, .e10-showroom) { margin-top: 40px; padding: 32px; border-left: 5px solid var(--gkp-green); background: var(--gkp-soft); }
:is(.gk-product, #gk-jura-e10) :is(.gkp-actions, .e10-actions) { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 24px; }
:is(.gk-product, #gk-jura-e10) a:is(.gkp-button, .e10-button) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  max-width: 100%;
  padding: 13px 23px;
  border: 2px solid var(--gkp-green-dark);
  border-radius: 3px;
  background: var(--gkp-green-dark);
  color: #fff;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  white-space: normal;
}
:is(.gk-product, #gk-jura-e10) a:is(.gkp-button, .e10-button):hover { background: var(--gkp-ink); border-color: var(--gkp-ink); color: #fff; }
:is(.gk-product, #gk-jura-e10) a:is(.gkp-button--secondary, .e10-button--secondary) { border-color: var(--gkp-green-dark); background: transparent; color: var(--gkp-green-dark); }
:is(.gk-product, #gk-jura-e10) a:is(.gkp-button--secondary, .e10-button--secondary):hover { background: var(--gkp-green-dark); color: #fff; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-footnote, .e10-footnote) { margin-top: 18px; color: var(--gkp-muted); font-size: 13px; line-height: 1.6; }
:is(.gk-product, #gk-jura-e10) :is(.gkp-video, .e10-video) { display: block; width: 100%; max-width: 100%; height: auto; margin: 24px 0 0; background: #0d0702; }

@media (max-width: 900px) {
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) { gap: 24px; padding: 26px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero-media, .e10-hero-media) { padding: 16px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-split, .e10-split) { gap: 26px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li { padding: 19px 10px; font-size: 13px; }
}

@media (max-width: 700px) {
  :is(.gk-product, #gk-jura-e10) { margin: 16px auto; font-size: 15px; line-height: 1.65; }
  :is(.gk-product, #gk-jura-e10) h2 { font-size: 28px; }
  :is(.gk-product, #gk-jura-e10) h3 { font-size: 24px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 24px 20px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) h2 { font-size: 35px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-lead, .e10-lead) { font-size: 17px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero-media, .e10-hero-media) { padding: 18px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero-media, .e10-hero-media) img { max-width: 240px; max-height: 310px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li { padding: 18px 12px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li:nth-child(2n) { border-right: 0; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li:nth-child(-n+2) { border-bottom: 1px solid var(--gkp-line); }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-section, .e10-section) { margin-top: 28px; padding-top: 26px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-split, .e10-split),
  :is(.gk-product, #gk-jura-e10) :is(.gkp-worlds, .e10-worlds) { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-split--reverse, .e10-split--reverse) :is(.gkp-media, .e10-media) { order: 0; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-world, .e10-world) { padding-top: 18px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-note, .e10-note) { padding: 15px 17px; }
  :is(.gk-product, #gk-jura-e10) table { font-size: 14px; }
  :is(.gk-product, #gk-jura-e10) th,
  :is(.gk-product, #gk-jura-e10) td { padding: 11px 10px; }
  :is(.gk-product, #gk-jura-e10) th { width: 43%; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-showroom, .e10-showroom) { margin-top: 28px; padding: 25px 20px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-actions, .e10-actions) { align-items: stretch; gap: 12px; }
  :is(.gk-product, #gk-jura-e10) a:is(.gkp-button, .e10-button) { width: 100%; }
}

@media print {
  :is(.gk-product, #gk-jura-e10) { max-width: none; margin: 0; color: #000; font-size: 11pt; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero),
  :is(.gk-product, #gk-jura-e10) :is(.gkp-showroom, .e10-showroom),
  :is(.gk-product, #gk-jura-e10) :is(.gkp-faq-item, .e10-faq-item) { break-inside: avoid; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) { padding: 20px; }
  :is(.gk-product, #gk-jura-e10) h2,
  :is(.gk-product, #gk-jura-e10) h3 { break-after: avoid; }
}

/* Související položky: bez ručně zapsaných cen a skladových stavů. */
:is(.gk-product, #gk-jura-e10) .gkp-related {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px; margin-top: 24px;
}
:is(.gk-product, #gk-jura-e10) .gkp-related-card {
  display: flex; flex-direction: column; min-width: 0;
  padding: 22px; border: 1px solid var(--gkp-line); background: #fff;
}
:is(.gk-product, #gk-jura-e10) .gkp-related-card h3 { font-size: 23px; }
:is(.gk-product, #gk-jura-e10) .gkp-related-card .gkp-card-link {
  display: block; margin-top: auto; padding-top: 12px; font-weight: 700;
}
/* Rozložení reaguje i na skutečnou šířku popisu v šabloně, ne jen na okno. */
@container (max-width: 720px) {
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) {
    grid-template-columns: minmax(0, 1fr); padding: 24px 20px; gap: 24px;
  }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero, .e10-hero) h2 { font-size: 34px; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-hero-media, .e10-hero-media) img {
    max-width: 260px; max-height: 350px;
  }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li:nth-child(2n) { border-right: 0; }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-facts, .e10-facts) li:nth-child(-n+2) {
    border-bottom: 1px solid var(--gkp-line);
  }
}
@container (max-width: 510px) {
  :is(.gk-product, #gk-jura-e10) :is(.gkp-worlds, .e10-worlds),
  :is(.gk-product, #gk-jura-e10) :is(.gkp-split, .e10-split),
  :is(.gk-product, #gk-jura-e10) .gkp-related { grid-template-columns: minmax(0, 1fr); }
  :is(.gk-product, #gk-jura-e10) :is(.gkp-button, .e10-button) { width: 100%; }
}
@media (max-width: 600px) {
  :is(.gk-product, #gk-jura-e10) .gkp-related { grid-template-columns: minmax(0, 1fr); }
}

/* Verze 2: čtyři světy chutí JURA E10 podle barev displeje.
   Beze změny HTML. Pořadí v již vloženém popisu:
   1 Hot Brew, 2 Cold Brew, 3 Light Brew, 4 Sweet Foam.
   Změna se týká pouze těchto čtyř karet; ostatní produktové bloky beze změny.
*/
#gk-jura-e10 #e10-chute :is(.gkp-worlds, .e10-worlds) > :is(.gkp-world, .e10-world):nth-child(1) {
  --gkp-world-background: #585958;
  --gkp-world-foreground: #ffffff;
  --gkp-world-edge: #424342;
}
#gk-jura-e10 #e10-chute :is(.gkp-worlds, .e10-worlds) > :is(.gkp-world, .e10-world):nth-child(2) {
  --gkp-world-background: #54a7c5;
  --gkp-world-foreground: #102832;
  --gkp-world-edge: #2b7d9b;
}
#gk-jura-e10 #e10-chute :is(.gkp-worlds, .e10-worlds) > :is(.gkp-world, .e10-world):nth-child(3) {
  --gkp-world-background: #976535;
  --gkp-world-foreground: #ffffff;
  --gkp-world-edge: #754c27;
}
#gk-jura-e10 #e10-chute :is(.gkp-worlds, .e10-worlds) > :is(.gkp-world, .e10-world):nth-child(4) {
  --gkp-world-background: #e1b044;
  --gkp-world-foreground: #30220a;
  --gkp-world-edge: #bb8b29;
}
#gk-jura-e10 #e10-chute :is(.gkp-worlds, .e10-worlds) > :is(.gkp-world, .e10-world) {
  min-width: 0;
  height: 100%;
  padding: 24px;
  border: 1px solid var(--gkp-world-edge);
  border-top: 4px solid var(--gkp-world-edge);
  border-radius: 6px;
  background: var(--gkp-world-background);
  color: var(--gkp-world-foreground);
}
#gk-jura-e10 #e10-chute :is(.gkp-world, .e10-world) :is(h3, p, strong, a, .gkp-world-label, .e10-world-label) {
  color: var(--gkp-world-foreground);
}
#gk-jura-e10 #e10-chute :is(.gkp-world, .e10-world) :is(.gkp-world-label, .e10-world-label) {
  margin-bottom: 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  opacity: 1;
}
#gk-jura-e10 #e10-chute :is(.gkp-world, .e10-world) h3 {
  margin-bottom: 14px;
}
#gk-jura-e10 #e10-chute :is(.gkp-world, .e10-world) a:focus-visible {
  outline-color: var(--gkp-world-foreground);
}
@media (max-width: 700px) {
  #gk-jura-e10 #e10-chute :is(.gkp-worlds, .e10-worlds) > :is(.gkp-world, .e10-world) {
    padding: 22px 20px;
  }
}
@container (max-width: 510px) {
  #gk-jura-e10 #e10-chute :is(.gkp-worlds, .e10-worlds) > :is(.gkp-world, .e10-world) {
    padding: 22px 20px;
  }
}
@media print {
  #gk-jura-e10 #e10-chute :is(.gkp-worlds, .e10-worlds) > :is(.gkp-world, .e10-world) {
    --gkp-world-foreground: #000000;
    background: #ffffff;
    break-inside: avoid;
  }
}