/* Homepage and photo examples, scoped to the refreshed OrientDig modules. */
.od-home {
  --od-ink: #172825;
  --od-muted: #435b54;
  --od-bg: #f6f8f4;
  --od-panel: #fff;
  --od-line: #d4dfd8;
  --od-accent: #16604b;
  --od-hero: #13352b;
  --od-hero-ink: #f5fcf8;
  --od-hero-muted: #d0e7dc;
  --od-hero-line: #547569;
  --od-button: #e0edb4;
  --od-button-ink: #203725;
  color: var(--od-ink);
}
.od-deals {
  --od-ink: #33251b;
  --od-muted: #675142;
  --od-bg: #fff9ee;
  --od-panel: #fffdf8;
  --od-line: #e2d1b8;
  --od-accent: #8c3c24;
  --od-hero: #f6e9d4;
  --od-hero-ink: #392519;
  --od-hero-muted: #684735;
  --od-hero-line: #c6a482;
  --od-button: #81361e;
  --od-button-ink: #fff;
}
.od-products {
  --od-ink: #1a2e44;
  --od-muted: #4b5d72;
  --od-bg: #eff4fa;
  --od-panel: #fff;
  --od-line: #cddbe9;
  --od-accent: #254f8a;
  --od-hero: #deeaf8;
  --od-hero-ink: #1b3556;
  --od-hero-muted: #395675;
  --od-hero-line: #a3bbd6;
  --od-button: #204b80;
  --od-button-ink: #fff;
}
.od-frame { width: min(1120px, calc(100% - 36px)); margin-inline: auto; min-width: 0; }
.od-home a:not(.od-primary) { color: var(--od-accent); }
.od-home a:focus-visible, .od-home input:focus-visible, .od-home button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}
.od-hero { background: var(--od-hero); color: var(--od-hero-ink); }
.od-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(24px, 5vw, 80px);
  padding-block: clamp(23px, 3vw, 39px);
}
.od-kicker {
  margin: 0 0 8px;
  color: var(--od-muted);
  font-size: .76rem;
  font-weight: 750;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.od-hero .od-kicker, .od-hero .od-lead { color: var(--od-hero-muted); }
.od-hero h1 {
  margin: 0;
  color: inherit;
  font-size: clamp(2.05rem, 4.6vw, 3.8rem);
  line-height: 1.03;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.od-hero h1 span { display: block; }
.od-hero .od-lead { margin: 13px 0 16px; max-width: 53ch; font-size: clamp(.98rem, 1.6vw, 1.14rem); line-height: 1.52; }
.od-search, .od-search .lbr-search-row {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.od-search { position: relative; margin: 0; }
.od-search label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.od-search input[type="search"] {
  flex: 1;
  width: 100%;
  min-width: 0;
  min-height: 48px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--od-hero-line);
  border-radius: 6px;
  background: var(--od-panel);
  color: var(--od-ink);
  font: inherit;
}
.od-search button, .od-home .od-primary {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 14px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: var(--od-button);
  color: var(--od-button-ink);
  font: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
.od-search button { min-height: 48px; }
.od-search .lbr-search-err { position: absolute; top: 100%; margin: 0; font-size: .82rem; }
.od-jump { display: flex; flex-wrap: wrap; gap: 3px 15px; margin-top: 14px; }
.od-hero .od-jump a:not(.od-primary) { color: var(--od-hero-ink); }
.od-jump a, .od-text-link { display: inline-flex; align-items: center; min-height: 36px; font-weight: 700; text-underline-offset: 3px; }
.od-hero-photo { margin: 0; display: grid; grid-template-columns: minmax(120px, 1fr) minmax(110px, .86fr); align-items: end; gap: 16px; }
.od-hero-photo img { width: 100%; height: 248px; object-fit: cover; object-position: center 43%; border-radius: 6px; }
.od-hero-photo figcaption { border-bottom: 1px solid var(--od-hero-line); padding-bottom: 10px; font-size: .86rem; color: var(--od-hero-muted); }
.od-hero-photo b { display: block; margin-bottom: 8px; font-size: 1.08rem; color: var(--od-hero-ink); }
.od-ticket {
  padding: 17px 19px;
  background: var(--od-panel);
  color: var(--od-ink);
  border: 1px solid var(--od-line);
  border-radius: 8px;
}
.od-deals .od-ticket { border-radius: 2px; border-bottom: 3px dashed var(--od-hero-line); transform: rotate(-2deg); box-shadow: 6px 8px 0 #76391618; }
.od-products .od-ticket { box-shadow: 7px 7px 0 var(--od-hero-line); }
.od-ticket strong { display: block; font-size: 1.18rem; margin-bottom: 6px; }
.od-ticket dl { margin: 0; }
.od-ticket dl div { display: grid; grid-template-columns: minmax(0, .76fr) minmax(0, 1.24fr); gap: 8px; padding: 7px 0; border-top: 1px solid var(--od-line); font-size: .91rem; }
.od-ticket dt { font-weight: 750; }
.od-ticket dd { margin: 0; color: var(--od-muted); }
.od-section { padding-block: clamp(25px, 4vw, 48px); scroll-margin-top: 100px; }
.od-section h2 { color: inherit; font-size: clamp(1.55rem, 3.1vw, 2.4rem); line-height: 1.12; margin: 0 0 9px; text-wrap: balance; }
.od-section .od-intro { margin: 0 0 15px; color: var(--od-muted); max-width: 70ch; }
.od-category { background: var(--od-bg); }
.od-cat-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.od-cat-grid li { display: flex; }
.od-home .od-cat-grid a {
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  border: 1px solid var(--od-line);
  border-radius: 8px;
  background: var(--od-panel);
  color: var(--od-ink);
  text-decoration: none;
}
.od-cat-grid a:hover, .od-cat-grid a:focus-visible { border-color: var(--od-accent); text-decoration: underline; }
.od-cat-grid img { width: 100%; height: auto; aspect-ratio: 4/3; display: block; object-fit: cover; background: #eeefef; }
.od-cat-grid span { padding: 8px; font-weight: 700; font-size: .84rem; line-height: 1.25; }
.od-deals .od-cat-grid a { border-radius: 3px; }
.od-products .od-cat-grid a { border-radius: 10px 10px 3px 3px; }
.od-benefits, .od-steps { display: grid; gap: 15px; margin: 18px 0 0; padding: 0; list-style: none; }
.od-benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.od-benefits li { padding: 13px 0 0; border-top: 2px solid var(--od-accent); }
.od-section h3 { margin: 0 0 5px; font-size: 1.12rem; line-height: 1.23; color: inherit; }
.od-section li p, .od-section article p { margin: 0; color: var(--od-muted); }
.od-guide { background: var(--od-bg); border-block: 1px solid var(--od-line); }
.od-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); counter-reset: step; }
.od-steps li { padding: 13px; border: 1px solid var(--od-line); border-radius: 6px; background: var(--od-panel); }
.od-steps li::before { counter-increment: step; content: '0' counter(step); display: block; margin-bottom: 6px; color: var(--od-accent); font-weight: 750; font-variant-numeric: tabular-nums; }
.od-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-top: 13px; }
.od-help-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: 20px; align-items: start; margin-top: 15px; }
.od-help-layout article { border: 1px solid var(--od-line); background: var(--od-panel); border-radius: 8px; padding: 16px; }
.od-fees { display: grid; gap: 12px; }
.od-fees p + p { margin-top: 10px; }
.od-media {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 10px;
  margin-top: 12px;
}
.od-media figure { margin: 0; min-width: 0; }
.od-media a { display: block; }
.od-media img { display: block; width: 100%; height: auto; aspect-ratio: 4/3; object-fit: contain; border-radius: 5px; background: #1b2825; }
.od-media figcaption { font-size: .84rem; color: var(--od-muted); margin: 4px 0 0; line-height: 1.38; }
.od-feature { background: var(--od-bg); border-block: 1px solid var(--od-line); }
.od-feature-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, .8fr); align-items: center; gap: 25px; }
.od-feature figure { margin: 0; display: grid; grid-template-columns: minmax(0, 130px) 1fr; gap: 13px; align-items: end; }
.od-feature img { width: 100%; height: auto; border-radius: 5px; }
.od-feature figcaption { color: var(--od-muted); font-size: .86rem; }
.od-feature figcaption b { display: block; color: var(--od-ink); margin-bottom: 4px; }
.od-qc-page { margin-block: 25px; padding: 16px; border: 1px solid var(--od-line); background: var(--od-bg); border-radius: 8px; }
.od-qc-page .od-media { max-width: 800px; }
.od-qc-page .od-media img { aspect-ratio: auto; }
@media (prefers-color-scheme: dark) {
  .od-home { --od-ink: #e9f1ef; --od-muted: #becdc8; --od-bg: #14241f; --od-panel: #1c2f27; --od-line: #42584c; --od-accent: #b2e0c4; }
  .od-deals { --od-ink: #fbebd9; --od-muted: #ddc7b1; --od-bg: #2b211b; --od-panel: #32261e; --od-line: #6a5140; --od-accent: #ffb68e; --od-hero: #3a2a20; --od-hero-ink: #fff1dd; --od-hero-muted: #ebceb2; --od-hero-line: #89654b; --od-button: #f7b288; --od-button-ink: #402217; }
  .od-products { --od-ink: #ecf2ff; --od-muted: #c4d4e8; --od-bg: #182536; --od-panel: #1f3044; --od-line: #425c78; --od-accent: #aacdff; --od-hero: #223854; --od-hero-ink: #f3f8ff; --od-hero-muted: #d4e3f9; --od-hero-line: #5a7ba3; --od-button: #abd1ff; --od-button-ink: #173150; }
  .od-search input::placeholder { color: var(--od-muted); }
}
@media (max-width: 940px) { .od-cat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 720px) {
  .od-frame { width: calc(100% - 28px); }
  .od-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .od-hero-photo, .od-ticket { display: none; }
  .od-hero h1 { text-wrap: wrap; }
  .od-help-layout, .od-feature-grid { grid-template-columns: minmax(0, 1fr); }
  .od-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .od-benefits { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}
@media (max-width: 500px) {
  .od-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .od-cat-grid img { aspect-ratio: 5/3; }
  .od-feature figure { grid-template-columns: minmax(0, 105px) 1fr; }
}

@media (min-width: 721px) { .od-feature .od-look-mobile { display: none; } .od-poland .od-feature-grid { grid-template-columns: minmax(0, 1fr); } }


/* Keep the existing links reachable in a single row on narrow screens. */
@media (max-width: 720px) {
  body:has(.od-hero) .dsu-head .dsu-wrap,
  body:has(.od-hero) .zpl-top .zpl-top-in {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    padding-block: 9px 5px;
  }
  body:has(.od-hero) :is(.dsu-nav, .zpl-nav) {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
  }
  body:has(.od-hero) :is(.dsu-nav, .zpl-nav) ul {
    display: flex;
    flex-wrap: nowrap;
    width: max-content;
    gap: 5px;
  }
  body:has(.od-hero) :is(.dsu-nav, .zpl-nav) a {
    white-space: nowrap;
    padding: 5px 8px;
  }
  .od-hero .od-search.dsu-search,
  .od-hero .od-search.zpl-search { flex-direction: row; align-items: stretch; padding: 4px; }
  .od-hero .od-search.dsu-search button,
  .od-hero .od-search.zpl-search button { flex: none; width: auto; }
  .od-jump { gap: 4px 12px; font-size: .94rem; }
}

.od-hero h1 { max-width: none; text-wrap: wrap; }
.od-hero-photo img { object-fit: contain; }
.od-help .od-media + p { margin-top: 10px; }
.od-poland .od-hero-grid h1 { font-size: clamp(2rem, 4.1vw, 3.35rem); }
@media (max-width: 500px) {
  .od-jump .od-primary { grid-column: 1 / -1; justify-self: start; }
  .od-jump { display: grid; grid-template-columns: repeat(2, max-content); row-gap: 0; }
  .od-category { padding-top: 22px; }
  .od-category h2 { font-size: 1.48rem; }
  .od-category .od-intro { font-size: .92rem; line-height: 1.42; margin-bottom: 11px; }
}

.od-cat-grid img { object-fit: contain; }
@media (max-width: 500px) {
  body:has(.od-hero) .lbr-top-in { gap: 8px; padding-inline: 14px; }
  body:has(.od-hero) .lbr-top-in .brandmark img { width: 108px; height: auto; }
  body:has(.od-hero) .lbr-top-in .lbr-mark-t { font-size: .85rem; }
  body:has(.od-hero) .lbr-top-in .lbr-menu { min-width: 55px; padding-inline: 7px; }
}

.od-guide-preview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin-top: 16px;
  padding: 14px;
  background: var(--od-panel);
  border: 1px solid var(--od-line);
  border-radius: 8px;
}
.od-guide-preview figure { margin: 0; }
.od-guide-preview img { display: block; width: 100%; max-height: 190px; height: auto; object-fit: contain; background: #fff; border-radius: 4px; }
.od-guide-preview figcaption { margin-top: 5px; font-size: .82rem; color: var(--od-muted); }
.od-guide-illustrations { display: flex; gap: 10px; margin-top: 16px; }
.od-guide-illustrations img { width: min(40%, 145px); height: auto; align-self: start; border-radius: 4px; }
.od-steps-detail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.od-steps-detail li::before { content: counter(step, decimal-leading-zero); }
@media (max-width: 580px) {
  .od-guide-preview, .od-steps-detail { grid-template-columns: minmax(0, 1fr); }
}


.od-resource-nav {
  border-top: 1px solid var(--od-line);
  background: var(--od-bg);
}
.od-resource-nav > div {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: flex-end;
  width: min(1120px, calc(100% - 36px));
  margin-inline: auto;
  min-height: 42px;
}
.od-resource-nav a {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  min-height: 40px;
  color: var(--od-accent);
  font: 700 .88rem/1.2 system-ui, sans-serif;
  text-underline-offset: 3px;
}
.od-resource-nav svg { width: 16px; height: 16px; flex-shrink: 0; }
.od-resource-nav a[aria-current=page] { color: var(--od-ink); }
.od-resource-nav a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.od-why .od-benefits { counter-reset: advantage; }
.od-why .od-benefits li {
  padding: 14px;
  background: var(--od-panel);
  border: 1px solid var(--od-line);
  border-top: 2px solid var(--od-accent);
  border-radius: 6px;
}
.od-why .od-benefits li::before {
  counter-increment: advantage;
  content: counter(advantage, decimal-leading-zero);
  display: block;
  color: var(--od-accent);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-bottom: 6px;
}
.od-why .od-benefits .od-text-link { margin-top: 4px; }
@media (max-width: 720px) {
  .od-resource-nav > div { justify-content: flex-start; width: calc(100% - 28px); gap: 16px; }
  .od-why .od-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 430px) {
  .od-why .od-benefits { grid-template-columns: minmax(0, 1fr); }
}

/* Deals: shelf tags and a ledger for the buying steps. */
.od-deals .od-cat-grid span { border-top: 1px dashed var(--od-line); }
.od-deals .od-benefits li {
  border-top: 1px solid var(--od-line);
  border-left: 3px solid var(--od-accent);
  border-radius: 3px;
}
@media (min-width: 721px) {
  .od-deals .od-cat-grid img { aspect-ratio: 3 / 2; }
  .od-deals .od-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .od-deals .od-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 24px;
  }
  .od-deals .od-steps li {
    border: 0;
    border-top: 1px dashed var(--od-accent);
    border-radius: 0;
    background: transparent;
  }
}