/** Shopify CDN: Minification failed

Line 159:0 Unexpected "}"

**/
/* ==========================================================================
   Lisbon coastal seafood skin for see-food1-1
   Palette, layered azulejo surfaces, decorative frames and the four signature
   sections. Density numbers live in density-desktop.css (loaded before this
   file) and are never contradicted here; this file only adds decoration.
   ========================================================================== */

:root {
  --lisbon-paper: #FAF7F0;
  --lisbon-paper-2: #EFF4FA;
  --lisbon-cobalt: #1E5FA8;
  --lisbon-mustard: #E8B93B;
  --lisbon-ink: #1A1A1A;
  --lisbon-teal: #2A9D8F;
  --lisbon-hairline: #B8C9E0;
  --lisbon-serif: "Marcellus", "Times New Roman", serif;
  --lisbon-sans: "Karla", "Helvetica Neue", Arial, sans-serif;

  /* hand-painted azulejo tile, seamless at 96px */
  --lisbon-tile: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%231E5FA8' stroke-width='1.6'%3E%3Ccircle cx='0' cy='0' r='20'/%3E%3Ccircle cx='96' cy='0' r='20'/%3E%3Ccircle cx='0' cy='96' r='20'/%3E%3Ccircle cx='96' cy='96' r='20'/%3E%3Cpath d='M48 26 70 48 48 70 26 48Z'/%3E%3Ccircle cx='48' cy='48' r='9'/%3E%3C/g%3E%3Cg fill='%231E5FA8'%3E%3Ccircle cx='48' cy='48' r='4.5'/%3E%3Ccircle cx='48' cy='12' r='3'/%3E%3Ccircle cx='48' cy='84' r='3'/%3E%3Ccircle cx='12' cy='48' r='3'/%3E%3Ccircle cx='84' cy='48' r='3'/%3E%3C/g%3E%3C/svg%3E");
  /* scallop shell medallion, drawn for section corners */
  --lisbon-shell: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cg fill='none' stroke='%231E5FA8' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M18 108a52 52 0 0 1 104 0'/%3E%3Cpath d='M70 108V56'/%3E%3Cpath d='M70 108 38 66'/%3E%3Cpath d='M70 108 102 66'/%3E%3Cpath d='M70 108 24 84'/%3E%3Cpath d='M70 108 116 84'/%3E%3Cpath d='M34 100a52 52 0 0 1 72 0'/%3E%3Cpath d='M56 118h28l-6-10H62Z'/%3E%3C/g%3E%3C/svg%3E");
  /* drawn Lisbon tram, used beside the hero call to action */
  --lisbon-tram: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='48' viewBox='0 0 96 48'%3E%3Cg fill='none' stroke='%231E5FA8' stroke-width='2' stroke-linecap='round'%3E%3Crect x='14' y='8' width='62' height='26' rx='4'/%3E%3Cpath d='M14 20h62'/%3E%3Cpath d='M24 34v6M66 34v6'/%3E%3Cpath d='M24 8 31 2M67 8l-7-6'/%3E%3Ccircle cx='29' cy='38' r='4.5'/%3E%3Ccircle cx='61' cy='38' r='4.5'/%3E%3Cpath d='M4 44h88'/%3E%3C/g%3E%3Cg fill='%231E5FA8'%3E%3Ccircle cx='29' cy='38' r='2'/%3E%3Ccircle cx='61' cy='38' r='2'/%3E%3C/g%3E%3C/svg%3E");
  --lisbon-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='24' viewBox='0 0 48 24'%3E%3Cg fill='none' stroke='%231E5FA8' stroke-width='1.6'%3E%3Cpath d='M0 18c6-8 12-8 18 0s12 8 18 0 12-8 18 0'/%3E%3Cpath d='M0 10c6-8 12-8 18 0s12 8 18 0 12-8 18 0'/%3E%3C/g%3E%3C/svg%3E");
  --lisbon-seal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='104' height='104' viewBox='0 0 104 104'%3E%3Ccircle cx='52' cy='52' r='46' fill='%23E8B93B'/%3E%3Ccircle cx='52' cy='52' r='46' fill='none' stroke='%23FAF7F0' stroke-width='2' stroke-dasharray='3 5'/%3E%3Ccircle cx='52' cy='52' r='36' fill='none' stroke='%231E5FA8' stroke-width='1.4'/%3E%3Ctext x='52' y='48' text-anchor='middle' font-family='Georgia,serif' font-size='26' fill='%231E5FA8'%3E4.8%3C/text%3E%3Ctext x='52' y='66' text-anchor='middle' font-family='Helvetica,Arial,sans-serif' font-size='9' letter-spacing='1.6' fill='%231E5FA8'%3ERATED%3C/text%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
   1. Layered paper surface
   Warm white base + two blue/white washes + a 14% cobalt tile lattice. The
   section wrappers are made transparent so the paper reads through, while
   every content box keeps its own opaque warm white.
   -------------------------------------------------------------------------- */
/* The painted azulejo wall supplied by the shop is the page background. It is
   tiled behind everything; the white content panels sit on top of it at 92%
   so the tilework still reads through at the seams and around the blocks. */
body.gradient {
  background-color: var(--lisbon-paper);
  background-image:
    linear-gradient(180deg, rgba(250, 247, 240, 0.30), rgba(250, 247, 240, 0.42)),
    radial-gradient(1200px 620px at 8% -6%, rgba(30, 95, 168, 0.10), transparent 62%),
    radial-gradient(1000px 560px at 96% 12%, rgba(42, 157, 143, 0.07), transparent 60%),
    url("/cdn/shop/files/bg-lisbon.jpg?v=1793865174");
  background-repeat: no-repeat, no-repeat, no-repeat, repeat;
  background-size: auto, auto, auto, 620px auto;
  background-position: center top, center top, center top, center top;
  background-attachment: scroll, scroll, scroll, fixed;
}

/* every full bleed wrapper is see through so the wall runs edge to edge */
#MainContent > .shopify-section > div.gradient,
#MainContent > .shopify-section > div.color-background-1,
#MainContent > .shopify-section > div.color-background-2,
#MainContent > .shopify-section > div.image-with-text,
#MainContent .image-with-text__grid,
#MainContent .collection-list,
#MainContent .trustpilot-reviews,
#MainContent .lisbon-sec {
  background: transparent !important;
}

/* Section corners: a scallop medallion at 8% */
#MainContent > .shopify-section {
  position: relative;
}
/* keep section content above the corner medallions */
#MainContent > .shopify-section > * {
  position: relative;
  z-index: 1;
}
#MainContent > .shopify-section::before,
#MainContent > .shopify-section::after {
  content: "";
  position: absolute;
  width: 140px;
  height: 140px;
  pointer-events: none;
  opacity: 0.08;
  background: var(--lisbon-shell) no-repeat center / contain;
  z-index: 0;
}
#MainContent > .shopify-section::before {
  left: 12px;
  top: 8px;
}
#MainContent > .shopify-section::after {
  right: 12px;
  bottom: 8px;
  transform: rotate(180deg);
}

/* --------------------------------------------------------------------------
   2. Ink, type and rules
   -------------------------------------------------------------------------- */
body,
.gradient {
  color: rgba(var(--color-foreground), 0.92);
}
h1, h2, h3, h4, h5, .h0, .h1, .h2, .h3,
.title, .image-with-text__heading, .collection-list-title,
.trustpilot-reviews__subheading, .footer-block__heading {
  font-family: var(--lisbon-serif) !important;
  font-weight: 600;
  letter-spacing: 0.005em;
}
body, p, .body, .rte, .button, .caption, .card__heading a,
.footer-block__details-content, .trustpilot-review__text {
  font-family: var(--lisbon-sans);
}
.title-with-highlight strong { color: var(--lisbon-cobalt) !important; }


/* --------------------------------------------------------------------------
   1b. White panels float on the azulejo wall
   Every content box is a warm white card at 94% so the tiled wall reads
   between and behind the blocks instead of being covered up.
   -------------------------------------------------------------------------- */
.lisbon-sec__inner,
.lisbon-map,
.lisbon-tiles,
.lisbon-notes,
.lisbon-cat__grid,
.lisbon-badges,
.lisbon-split {
  background: rgba(250, 247, 240, 0.94);
  box-shadow: 0 1px 0 rgba(184, 201, 224, 0.9);
}
.lisbon-sec__inner {
  padding: 26px clamp(16px, 3vw, 40px) 30px;
  border: 1px solid rgba(184, 201, 224, 0.9);
  border-radius: 2px;
}
.lisbon-badges,
.lisbon-tiles,
.lisbon-notes,
.lisbon-cat__grid,
.lisbon-map,
.lisbon-split {
  padding: 22px clamp(14px, 2.4vw, 30px) 24px;
  border: 1px solid rgba(184, 201, 224, 0.9);
  border-radius: 2px;
}
@media screen and (max-width: 749px) {
  .lisbon-sec__inner { padding: 18px 14px 20px; }
  .lisbon-badges, .lisbon-tiles, .lisbon-notes, .lisbon-cat__grid, .lisbon-map, .lisbon-split {
    padding: 14px 12px 16px;
  }
}

/* the supplied shell badge is a wide mark: cap it on mobile so the header band
   keeps the height it had before the logo swap */

}

/* pale blue hairline between bands */
#MainContent > .shopify-section + .shopify-section > div:first-child {
  border-top: 1px solid rgba(184, 201, 224, 0.75);
}

/* --------------------------------------------------------------------------
   3. Buttons : mustard fill, near-black label, 2px radius
   -------------------------------------------------------------------------- */
.button,
.shopify-payment-button__button--unbranded,
button.button {
  border-radius: 2px !important;
  background-color: var(--lisbon-mustard);
  color: var(--lisbon-ink);
  border: 1px solid rgba(30, 95, 168, 0.25);
  font-family: var(--lisbon-sans);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
@media screen and (min-width: 750px) {
  /* label size is part of the desktop density pass; mobile keeps the theme's */
  .button,
  .shopify-payment-button__button--unbranded,
  button.button {
    font-size: 1.3rem;
  }
}
.button:hover,
button.button:hover {
  background-color: #f0c64f;
  color: var(--lisbon-ink);
  box-shadow: 0 0 0 2px rgba(30, 95, 168, 0.18);
}
.button--secondary {
  background-color: transparent;
  color: var(--lisbon-cobalt);
  border: 1px solid var(--lisbon-cobalt);
}

/* --------------------------------------------------------------------------
   4. Hero : azulejo tile border framing a warm white centre
   -------------------------------------------------------------------------- */
[id$="__image_with_text_BY6VR9"] .image-with-text {
  background: transparent;
}
[id$="__image_with_text_BY6VR9"] .image-with-text__grid {
  background: rgba(250, 247, 240, 0.94);
  border: 22px solid transparent;
  border-image: var(--lisbon-tile) 26 round;
  border-image-width: 22px;
}
/* cobalt serif h1 with a mustard double rule underneath */
[id$="__image_with_text_BY6VR9"] .image-with-text__heading::after {
  content: "";
  display: block;
  width: 92px;
  height: 6px;
  margin-top: 18px;
  border-top: 2px solid var(--lisbon-mustard);
  border-bottom: 1px solid var(--lisbon-mustard);
}
/* the illustrated tram sits at the start of the CTA. The theme's link-button
   hover treatment draws an arrow in ::before, so the id in this selector is
   deliberate: it has to beat .link-btns--arrow a.button:not([aria-disabled]). */
#MainContent [id$="__image_with_text_BY6VR9"] .image-with-text__content a.button::before,
#MainContent [id$="__image_with_text_BY6VR9"] .image-with-text__content a.button:hover::before {
  content: "";
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  flex: 0 0 auto;
  display: block;
  width: 64px;
  height: 32px;
  margin-right: 14px;
  transform: none;
  clip-path: none;
  box-shadow: none;
  border-radius: 0;
  background: var(--lisbon-tram) no-repeat center / contain;
}
#MainContent [id$="__image_with_text_BY6VR9"] .image-with-text__content a.button:hover {
  padding-right: 3rem;
}

/* --------------------------------------------------------------------------
   5. Shell medallion divider + Mercado ribbon (custom liquid #1)
   -------------------------------------------------------------------------- */
.lisbon-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  width: 100%;
}
.lisbon-divider__rule {
  flex: 1 1 auto;
  height: 1px;
  max-width: 320px;
  background: linear-gradient(90deg, transparent, var(--lisbon-hairline), transparent);
}
.lisbon-divider__shell {
  width: 64px;
  height: 64px;
  flex: 0 0 auto;
  background: var(--lisbon-shell) no-repeat center / contain;
  opacity: 0.9;
}
.lisbon-ribbon {
  display: table;
  margin: 0 auto;
  position: relative;
  padding: 10px 40px;
  background: var(--lisbon-cobalt);
  color: var(--lisbon-paper);
  font-family: var(--lisbon-serif);
  font-size: 1.9rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%);
}
.lisbon-ribbon__sub {
  display: block;
  margin-top: 8px;
  text-align: center;
  font-family: var(--lisbon-sans);
  font-size: 1.2rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lisbon-teal);
}

/* --------------------------------------------------------------------------
   6. Badge row (custom liquid #2)
   -------------------------------------------------------------------------- */
.lisbon-badges {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}
.lisbon-badge {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  background: var(--lisbon-paper);
  border: 1px solid var(--lisbon-cobalt);
  border-radius: 2px;
  box-shadow: inset 0 0 0 4px var(--lisbon-paper), inset 0 0 0 5px rgba(184, 201, 224, 0.9);
}
.lisbon-badge__icon {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  color: var(--lisbon-cobalt);
}
.lisbon-badge__icon svg {
  width: 100%;
  height: 100%;
  display: block;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.lisbon-badge__title {
  display: block;
  font-family: var(--lisbon-serif);
  font-size: 1.55rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lisbon-cobalt);
}
.lisbon-badge__note {
  display: block;
  margin-top: 3px;
  font-family: var(--lisbon-sans);
  font-size: 1.15rem;
  color: rgba(30, 95, 168, 0.72);
}

/* --------------------------------------------------------------------------
   7. Product and collection cards : cobalt tile border, corner shells,
      warm white label on a cobalt strip
   -------------------------------------------------------------------------- */
.card,
.card__inner {
  border-radius: 2px;
}
/* Corner shells are drawn on .card__inner::after, never ::before: the theme
   puts .ratio on the same element and its ::before is the aspect-ratio
   spacer, so taking ::before over collapses the card to zero height.
   ::after is free for card--card cards (the theme only uses it on .card). */
.card__inner,
.card--text {
  position: relative;
  background-color: var(--lisbon-paper);
  border: 1px solid var(--lisbon-cobalt);
  box-shadow: none;
  overflow: visible;
}
.card__inner::after {
  content: "";
  position: absolute;
  inset: 3px;
  pointer-events: none;
  z-index: 3;
  background-image: var(--lisbon-shell), var(--lisbon-shell), var(--lisbon-shell), var(--lisbon-shell);
  background-repeat: no-repeat;
  background-size: 22px 22px;
  background-position: left top, right top, left bottom, right bottom;
  opacity: 0.9;
}
.card__inner .card__media,
.card--text .card__media {
  border-radius: 2px;
  overflow: hidden;
}
/* warm white label printed on a cobalt strip */
.card__information,
.card__content .card__information {
  background: var(--lisbon-cobalt);
  color: var(--lisbon-paper);
  border-radius: 2px;
}
.card__information .card__heading,
.card__information .card__heading a,
.card__information .price,
.card__information .price__container,
.card__information .caption,
.card__information .card__badge,
.card__information .price-item,
.card__information .unit-price {
  color: var(--lisbon-paper) !important;
}
.card__information .price-item--sale,
.card__information .card__heading a:hover {
  color: var(--lisbon-mustard) !important;
}
.card__badge .badge {
  border-radius: 2px;
  background: var(--lisbon-mustard);
  color: var(--lisbon-ink);
  border: 0;
}
/* the cobalt strip needs a little breathing room, but only on desktop:
   390px keeps the theme's own 1rem padding so the mobile card is untouched. */
@media screen and (min-width: 750px) {
  .card__information,
  .card__content .card__information {
    margin: 0 3px 3px;
    padding: 10px 12px 12px;
  }
}
/* quick add keeps its affordance, restyled */
.card .quick-add__submit {
  border-radius: 2px;
  background: var(--lisbon-mustard);
  color: var(--lisbon-ink);
}

/* --------------------------------------------------------------------------
   8. Image-with-text #2 (Lisbon waterfront) and #3 (cataplana)
   -------------------------------------------------------------------------- */
/* blue tile wash over the waterfront photo */
[id$="__image_with_text_iTTDAz"] .image-with-text__media {
  position: relative;
  border: 1px solid var(--lisbon-cobalt);
  overflow: hidden;
}
[id$="__image_with_text_iTTDAz"] .image-with-text__media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(to bottom, rgba(30, 95, 168, 0.30), rgba(30, 95, 168, 0.12) 55%, rgba(250, 247, 240, 0.22)),
    var(--lisbon-tile);
  background-size: auto, 72px 72px;
  background-repeat: no-repeat, repeat;
  opacity: 0.85;
}
/* scalloped border on the text box */
[id$="__image_with_text_iTTDAz"] .image-with-text__content {
  position: relative;
  background: rgba(250, 247, 240, 0.94);
  border: 1px solid var(--lisbon-cobalt);
  border-radius: 2px;
  margin: 14px 0;
  padding: 34px 32px;
}
[id$="__image_with_text_iTTDAz"] .image-with-text__content::before,
[id$="__image_with_text_iTTDAz"] .image-with-text__content::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 11px;
  pointer-events: none;
  background-image: radial-gradient(circle at 11px 11px, var(--lisbon-cobalt) 10px, transparent 10px);
  background-size: 22px 22px;
  background-repeat: repeat-x;
}
[id$="__image_with_text_iTTDAz"] .image-with-text__content::before {
  top: -11px;
  background-position: 0 0;
}
[id$="__image_with_text_iTTDAz"] .image-with-text__content::after {
  bottom: -11px;
  background-position: 0 -11px;
}

/* tile corner motifs on the cataplana photo */
[id$="__image_with_text_dXAf9E"] .image-with-text__media {
  position: relative;
  border: 1px solid var(--lisbon-cobalt);
  overflow: hidden;
}
[id$="__image_with_text_dXAf9E"] .image-with-text__media::before,
[id$="__image_with_text_dXAf9E"] .image-with-text__media::after {
  content: "";
  position: absolute;
  width: 74px;
  height: 74px;
  pointer-events: none;
  background-image: var(--lisbon-tile);
  background-size: 37px 37px;
  opacity: 0.9;
  z-index: 2;
}
[id$="__image_with_text_dXAf9E"] .image-with-text__media::before {
  left: 0;
  top: 0;
}
[id$="__image_with_text_dXAf9E"] .image-with-text__media::after {
  right: 0;
  bottom: 0;
}
[id$="__image_with_text_dXAf9E"] .image-with-text__content {
  background: rgba(250, 247, 240, 0.94);
  border: 1px solid var(--lisbon-hairline);
  border-radius: 2px;
  padding: 32px 30px;
}

/* --------------------------------------------------------------------------
   9. Trustpilot : clean paper cards, real five-star glyphs, legible copy
   -------------------------------------------------------------------------- */
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-reviews {
  position: relative;
}

/* the review card: warm paper with a hand-painted tile frame. The tile used to
   sit behind the copy and the cobalt text disappeared into the cobalt lines. */
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review {
  background-color: rgba(253, 251, 246, 0.98);
  background-image: none;
  border: 10px solid transparent;
  border-image: var(--lisbon-tile) 26 round;
  border-image-width: 10px;
  border-radius: 0;
  box-shadow: none;
  color: var(--lisbon-ink);
  padding: 22px 24px 24px;
}
/* raise the copy above the tile frame, but never touch positioned children:
   the star overlay is absolutely placed on top of the underlay svg. Making it
   relative dropped it into normal flow and the card showed ten stars. */
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review h3,
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .rte,
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .testimonial-card__author-container,
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .rating-stars__container--underlay {
  position: relative;
  z-index: 1;
}
/* copy: near-black on paper, never cobalt on cobalt */
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .rte,
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .rte p,
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .testimonial-card__author {
  color: var(--lisbon-ink);
  font-family: var(--lisbon-sans);
  font-size: 1.5rem;
  line-height: 1.62;
  opacity: 1;
}
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review h3 {
  color: var(--lisbon-cobalt);
  font-family: var(--lisbon-serif);
  font-weight: 400;
  line-height: 1.3;
  margin: 0 0 10px;
}
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .testimonial-card__author {
  color: var(--lisbon-cobalt);
  font-size: 1.3rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.85;
}

/* Stars. The theme ships a Trustpilot lockup: a filled square behind each
   star. That reads as brand blocks, not as a five-star rating, so the square
   path is dropped and only the star glyph is painted. */
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-stars-svg,
[id$="__trustpilot_reviews_pikLnG"] .banner .trustpilot-stars-svg {
  color: var(--lisbon-mustard);
}
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-stars-svg path:first-of-type {
  display: none;
}
[id$="__trustpilot_reviews_pikLnG"] .rating-stars__container--underlay > svg path:last-of-type {
  fill: #D7DFEA !important;
}
[id$="__trustpilot_reviews_pikLnG"] .rating-stars__container--overlay svg path:last-of-type {
  fill: var(--lisbon-mustard) !important;
}
[id$="__trustpilot_reviews_pikLnG"] .rating-stars__container--overlay {
  --color-foreground: 232, 185, 59;
}
/* one row of five stars only: the filled overlay is clipped to the left of
   the same star strip, never laid out beside it */
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .rating-stars__container--overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  width: calc(100% / 5 * var(--rating));
}
/* the star row must stay as wide as its own glyphs, otherwise a fractional
   rating is clipped against the card width instead of the star strip */
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .rating-stars__container--underlay {
  width: fit-content;
  margin-bottom: 14px;
}
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .trustpilot-stars-svg {
  height: 1.9rem;
}

/* wax-seal stamp beside the rating line */
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-reviews__content-container {
  position: relative;
}
[id$="__trustpilot_reviews_pikLnG"] .trustpilot-reviews__content-container::after {
  content: "";
  position: absolute;
  right: 6px;
  top: 50%;
  width: 92px;
  height: 92px;
  margin-top: -46px;
  background: var(--lisbon-seal) no-repeat center / contain;
  transform: rotate(-9deg);
  pointer-events: none;
  opacity: 0.95;
}
@media screen and (min-width: 750px) {
  [id$="__trustpilot_reviews_pikLnG"] .trustpilot-review {
    padding: 26px 28px 28px;
  }
}
@media screen and (max-width: 749px) {
  [id$="__trustpilot_reviews_pikLnG"] .trustpilot-review {
    border-width: 8px;
    border-image-width: 8px;
    padding: 18px 18px 20px;
  }
  [id$="__trustpilot_reviews_pikLnG"] .trustpilot-review .trustpilot-stars-svg {
    height: 1.7rem;
  }
}

/* --------------------------------------------------------------------------
   10. Collection list : three illustrated borders
   -------------------------------------------------------------------------- */
[id$="__collection_list_xX4KRW"] .collection-list .card-wrapper:nth-child(3n + 1) .card__inner,
[id$="__collection_list_xX4KRW"] .collection-list .card-wrapper:nth-child(3n + 1) .card--text {
  border-image: var(--lisbon-tile) 12 round;
  border-image-width: 8px;
  border: 8px solid transparent;
}
[id$="__collection_list_xX4KRW"] .collection-list .card-wrapper:nth-child(3n + 2) .card__inner,
[id$="__collection_list_xX4KRW"] .collection-list .card-wrapper:nth-child(3n + 2) .card--text {
  border-image: var(--lisbon-wave) 12 round;
  border-image-width: 8px;
  border: 8px solid transparent;
}
[id$="__collection_list_xX4KRW"] .collection-list .card-wrapper:nth-child(3n + 3) .card__inner,
[id$="__collection_list_xX4KRW"] .collection-list .card-wrapper:nth-child(3n + 3) .card--text {
  border-image: var(--lisbon-shell) 20 round;
  border-image-width: 8px;
  border: 8px solid transparent;
}

/* --------------------------------------------------------------------------
   11. Signature sections
   -------------------------------------------------------------------------- */
.lisbon-sec {
  position: relative;
  background: transparent;
}
.lisbon-sec__inner {
  position: relative;
}
.lisbon-eyebrow {
  display: inline-block;
  margin-bottom: 10px;
  font-family: var(--lisbon-sans);
  font-size: 1.15rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--lisbon-teal);
}
.lisbon-h2 {
  margin: 0 0 10px;
  font-family: var(--lisbon-serif);
  font-weight: 600;
  color: var(--lisbon-cobalt);
  font-size: 3.4rem;
  line-height: 1.16;
}
.lisbon-lede {
  margin: 0;
  max-width: 54ch;
  font-family: var(--lisbon-sans);
  font-size: 1.45rem;
  line-height: 1.62;
  color: rgba(30, 95, 168, 0.84);
}
.lisbon-rule {
  height: 1px;
  background: linear-gradient(90deg, var(--lisbon-mustard), rgba(232, 185, 59, 0.15));
  margin: 18px 0;
}

/* 11a. Cataplana pot */
.lisbon-cat__grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 34px;
  align-items: center;
}
.lisbon-cat__media {
  position: relative;
  border: 1px solid var(--lisbon-cobalt);
  border-radius: 2px;
  overflow: hidden;
  background: var(--lisbon-paper);
}
.lisbon-cat__media img {
  display: block;
  width: 100%;
  height: 100%;
  /* the photo is square and must stay whole; the frame letterboxes it */
  object-fit: contain;
  aspect-ratio: 1 / 1;
}
.lisbon-cat__media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 10px rgba(250, 247, 240, 0.55), inset 0 0 0 11px var(--lisbon-hairline);
}
.lisbon-cat__tag {
  position: absolute;
  left: 16px;
  bottom: 16px;
  z-index: 2;
  padding: 7px 14px;
  background: var(--lisbon-paper);
  border: 1px solid var(--lisbon-cobalt);
  border-radius: 2px;
  font-family: var(--lisbon-sans);
  font-size: 1.1rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--lisbon-cobalt);
}
.lisbon-specials {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
}
.lisbon-special {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  align-items: baseline;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--lisbon-mustard);
}
.lisbon-special:first-child {
  border-top: 1px solid var(--lisbon-mustard);
}
.lisbon-special__bullet {
  width: 12px;
  height: 12px;
  align-self: center;
  background: var(--lisbon-shell) no-repeat center / contain;
  opacity: 0.95;
}
.lisbon-special__dish {
  display: block;
  font-family: var(--lisbon-serif);
  font-size: 1.75rem;
  color: var(--lisbon-cobalt);
  line-height: 1.25;
}
.lisbon-special__region {
  display: block;
  margin-top: 3px;
  font-family: var(--lisbon-sans);
  font-size: 1.15rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(30, 95, 168, 0.66);
}
.lisbon-special__price {
  font-family: var(--lisbon-serif);
  font-size: 1.85rem;
  color: var(--lisbon-teal);
  white-space: nowrap;
}

/* 11b. Tile gallery */
.lisbon-tiles {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
  margin-top: 26px;
}
.lisbon-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  aspect-ratio: 1 / 1;
  padding: 12px 8px;
  background-color: var(--lisbon-cobalt);
  color: var(--lisbon-paper);
  border-radius: 2px;
  text-align: center;
  overflow: hidden;
}
.lisbon-tile::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(250, 247, 240, 0.42);
  border-radius: 1px;
  pointer-events: none;
}
.lisbon-tile__icon {
  width: 46px;
  height: 46px;
  color: var(--lisbon-paper);
}
.lisbon-tile__icon svg {
  width: 100%;
  height: 100%;
  display: block;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.lisbon-tile__name {
  font-family: var(--lisbon-serif);
  font-size: 1.2rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.2;
}

/* 11c. Lisbon waterfront map */
.lisbon-map {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 30px;
  align-items: center;
  margin-top: 24px;
}
.lisbon-map__canvas {
  position: relative;
  border: 1px solid var(--lisbon-cobalt);
  border-radius: 2px;
  background: var(--lisbon-paper-2);
  overflow: hidden;
}
.lisbon-map__canvas svg {
  display: block;
  width: 100%;
  height: auto;
}
.lisbon-map__pin-label {
  font-family: var(--lisbon-sans);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  fill: var(--lisbon-cobalt);
}
.lisbon-map__port {
  font-family: var(--lisbon-serif);
  font-size: 13px;
  fill: var(--lisbon-ink);
}
.lisbon-ports {
  list-style: none;
  margin: 0;
  padding: 0;
}
.lisbon-port {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--lisbon-hairline);
}
.lisbon-port:first-child {
  border-top: 1px solid var(--lisbon-hairline);
}
.lisbon-port__pin {
  width: 16px;
  height: 16px;
  margin-top: 4px;
  border-radius: 50% 50% 50% 0;
  background: var(--lisbon-mustard);
  border: 1px solid rgba(30, 95, 168, 0.5);
  transform: rotate(-45deg);
}
.lisbon-port__name {
  display: block;
  font-family: var(--lisbon-serif);
  font-size: 1.6rem;
  color: var(--lisbon-cobalt);
}
.lisbon-port__meta {
  display: block;
  margin-top: 2px;
  font-family: var(--lisbon-sans);
  font-size: 1.15rem;
  color: rgba(30, 95, 168, 0.68);
}

/* 11d. Chef's notes */
.lisbon-notes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 26px;
}
.lisbon-note {
  position: relative;
  padding: 20px 20px 18px;
  background: var(--lisbon-paper);
  border: 1px solid var(--lisbon-cobalt);
  border-radius: 2px;
  box-shadow: inset 0 0 0 5px var(--lisbon-paper), inset 0 0 0 6px rgba(184, 201, 224, 0.9);
}
.lisbon-note__sketch {
  width: 100%;
  height: 86px;
  color: var(--lisbon-cobalt);
  border-bottom: 1px solid var(--lisbon-mustard);
  margin-bottom: 14px;
}
.lisbon-note__sketch svg {
  width: 100%;
  height: 100%;
  display: block;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.lisbon-note__index {
  font-family: var(--lisbon-sans);
  font-size: 1.05rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--lisbon-teal);
}
.lisbon-note__title {
  display: block;
  margin: 6px 0 8px;
  font-family: var(--lisbon-serif);
  font-size: 1.85rem;
  line-height: 1.22;
  color: var(--lisbon-cobalt);
}
.lisbon-note__body {
  font-family: var(--lisbon-sans);
  font-size: 1.28rem;
  line-height: 1.62;
  color: rgba(30, 95, 168, 0.82);
}
.lisbon-note__meta {
  margin-top: 10px;
  font-family: var(--lisbon-sans);
  font-size: 1.08rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(30, 95, 168, 0.6);
}

/* --------------------------------------------------------------------------
   12. Motion : tile bloom
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .lisbon-bloom {
    opacity: 0;
    transform: translateY(14px) scale(0.985);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
    will-change: opacity, transform;
  }
  .lisbon-bloom.is-bloomed {
    opacity: 1;
    transform: none;
  }
  .lisbon-tile.is-bloomed .lisbon-tile__icon,
  .lisbon-note.is-bloomed .lisbon-note__sketch svg {
    animation: lisbon-bloom-in 0.8s ease-out both;
  }
}
@keyframes lisbon-bloom-in {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .lisbon-bloom,
  .lisbon-bloom.is-bloomed {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}

/* --------------------------------------------------------------------------
   13. Small screens : the new sections only. Base sections keep their own
       mobile rules untouched.
   -------------------------------------------------------------------------- */
@media screen and (max-width: 749px) {
  .lisbon-cat__grid,
  .lisbon-map {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .lisbon-badges {
    grid-template-columns: 1fr;
  }
  .lisbon-tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lisbon-notes {
    grid-template-columns: 1fr;
  }
  .lisbon-h2 {
    font-size: 2.5rem;
  }
  .lisbon-ribbon {
    font-size: 1.45rem;
    padding: 9px 26px;
  }
  [id$="__image_with_text_iTTDAz"] .image-with-text__content::before,
  [id$="__image_with_text_iTTDAz"] .image-with-text__content::after {
    display: none;
  }
  [id$="__image_with_text_BY6VR9"] .image-with-text__grid {
    border-width: 10px;
  }
  [id$="__image_with_text_BY6VR9"] .image-with-text__content a.button::before {
    display: none;
  }
  [id$="__trustpilot_reviews_pikLnG"] .trustpilot-reviews__content-container::after {
    display: none;
  }
  #MainContent > .shopify-section::before,
  #MainContent > .shopify-section::after {
    display: none;
  }
  /* The featured collection now ships a mobile slider, which makes the theme
     switch the card label to its compact half-rem variant through
     [data-mobile-columns="2"]. Restore the base one-rem label box so the
     390px card metrics match the theme's original spacing. */
  .splide__slide__container[data-mobile-columns="2"] .card--card .card__information,
  .grid--2-col-tablet-down .card--card .card__information {
    padding: 1rem;
  }
  /* The slider shell also picks up the theme's card shadow padding, which the
     original grid did not have. Drop it at 390px so the card box is identical. */
  .splide:not(.splide--destroy-mobile) .splide__slide__container--card {
    padding-top: 0;
    padding-bottom: 0;
  }
}

/* new linked cards keep the tile look but act as links */
a.lisbon-tile,
a.lisbon-note,
a.lisbon-map__pin,
a.lisbon-port__link {
  color: inherit;
  text-decoration: none;
}
a.lisbon-tile:hover,
a.lisbon-note:hover {
  border-color: var(--lisbon-mustard);
  box-shadow: 0 2px 0 rgba(232, 185, 59, 0.85);
}
a.lisbon-map__pin:hover span {
  background: var(--lisbon-cobalt);
  color: var(--lisbon-paper);
}
a.lisbon-port__link {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
a.lisbon-port__link:hover .lisbon-port__name {
  color: var(--lisbon-mustard);
}


/* --------------------------------------------------------------------------
   Banner hero : the shop's own main image as a full-bleed banner, with the
   azulejo frame and a warm white text plate on the emptier left side.
   -------------------------------------------------------------------------- */
[id$="__image_banner_hero"] .banner__media::after {
  background: linear-gradient(90deg, rgba(26, 26, 26, 0.34) 0%, rgba(26, 26, 26, 0.10) 46%, rgba(26, 26, 26, 0) 72%);
  opacity: 1;
}
[id$="__image_banner_hero"] .banner__media img {
  object-fit: cover;
}
/* tile frame drawn on the banner itself, matching the rest of the page */
[id$="__image_banner_hero"] .banner {
  border: 14px solid transparent;
  border-image: var(--lisbon-tile) 26 round;
  border-image-width: 14px;
}
/* the text plate: warm white panel so the copy stays legible on any crop */
[id$="__image_banner_hero"] .banner__box {
  background: rgba(250, 247, 240, 0.94);
  border: 1px solid rgba(184, 201, 224, 0.9);
  border-radius: 2px;
  color: var(--lisbon-ink);
  --color-foreground: 26, 26, 26;
  --color-button: 232, 185, 59;
  --color-button-text: 26, 26, 26;
  max-width: 52rem;
  padding: 34px 38px;
  text-align: left;
}
[id$="__image_banner_hero"] .banner__heading {
  color: var(--lisbon-cobalt);
  font-family: var(--lisbon-serif);
  font-weight: 400;
  letter-spacing: 0.01em;
  margin: 0;
}
[id$="__image_banner_hero"] .banner__heading::after {
  content: "";
  display: block;
  width: 92px;
  height: 6px;
  margin-top: 18px;
  border-top: 2px solid var(--lisbon-mustard);
  border-bottom: 1px solid var(--lisbon-mustard);
}
[id$="__image_banner_hero"] .banner__heading strong {
  color: var(--lisbon-mustard);
}
[id$="__image_banner_hero"] .banner__text {
  color: var(--lisbon-ink);
  font-family: var(--lisbon-sans);
  margin-top: 16px;
}
[id$="__image_banner_hero"] .banner__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}
/* the tram mark on the first CTA, same treatment as the other sections */
#MainContent [id$="__image_banner_hero"] .banner__buttons a.button::before,
#MainContent [id$="__image_banner_hero"] .banner__buttons a.button:hover::before {
  content: "";
  position: relative;
  top: auto; right: auto; bottom: auto; left: auto;
  flex: 0 0 auto;
  display: block;
  width: 64px; height: 32px;
  margin-right: 12px;
  transform: none;
  clip-path: none;
  box-shadow: none;
  border-radius: 0;
  background: var(--lisbon-tram) no-repeat center / contain;
}
@media screen and (min-width: 750px) {
  #MainContent [id$="__image_banner_hero"] .banner__buttons a.button:hover {
    padding-right: 3rem;
  }
  [id$="__image_banner_hero"] .banner__content--middle-left {
    padding-left: 4rem;
  }
  [id$="__image_banner_hero"] .banner__box {
    padding: 38px 42px;
  }
}
@media screen and (max-width: 749px) {
  [id$="__image_banner_hero"] .banner {
    border-width: 10px;
    border-image-width: 10px;
  }
  [id$="__image_banner_hero"] .banner__box {
    max-width: 100%;
    padding: 22px 20px 24px;
    background: rgba(250, 247, 240, 0.96);
  }
  [id$="__image_banner_hero"] .banner__heading::after {
    width: 72px;
    margin-top: 12px;
  }
  [id$="__image_banner_hero"] .banner__text {
    margin-top: 12px;
  }
  [id$="__image_banner_hero"] .banner__buttons {
    gap: 10px;
    margin-top: 16px;
  }
  [id$="__image_banner_hero"] .banner__buttons a.button {
    flex: 1 1 100%;
  }
  #MainContent [id$="__image_banner_hero"] .banner__buttons a.button::before,
  #MainContent [id$="__image_banner_hero"] .banner__buttons a.button:hover::before {
    width: 48px;
    height: 24px;
    margin-right: 10px;
  }
}


/* --------------------------------------------------------------------------
   Footer : the cobalt band used to hold near black copy, which is unreadable.
   Every footer block sits on warm paper and every menu link gets its own
   cream block, so the text never fights the blue.
   -------------------------------------------------------------------------- */
.footer {
  background-color: var(--lisbon-cobalt);
}
.footer__blocks-wrapper {
  row-gap: 20px;
}
/* the three footer columns are paper cards with the azulejo frame */
.footer .footer-block {
  background: rgba(250, 247, 240, 0.97);
  border: 10px solid transparent;
  border-image: var(--lisbon-tile) 26 round;
  border-image-width: 10px;
  border-radius: 0;
  box-sizing: border-box;
  padding: 16px 18px 18px;
}
.footer .footer-block__heading {
  color: var(--lisbon-cobalt);
  margin-bottom: 14px;
}
.footer .footer-block__details-content,
.footer .footer-block__details-content.rte,
.footer .footer-block__details-content p {
  background: transparent;
  color: var(--lisbon-ink);
}
/* one cream block per policy / company link */
.footer .footer-block--menu .footer-block__details-content,
.footer .footer-block--menu .list-unstyled {
  background: transparent;
  padding: 0;
  margin: 0;
}
.footer .footer-block--menu li {
  margin: 0 0 8px;
}
.footer .footer-block--menu li:last-child {
  margin-bottom: 0;
}
.footer .footer-block--menu a.list-menu__item {
  display: block;
  box-sizing: border-box;
  padding: 9px 12px;
  background: #FFFDF8;
  border: 1px solid var(--lisbon-hairline);
  border-radius: 2px;
  color: var(--lisbon-ink);
  font-family: var(--lisbon-sans);
  font-size: 1.4rem;
  line-height: 1.35;
  text-decoration: none;
  transition: background-color 0.18s ease, border-color 0.18s ease;
}
.footer .footer-block--menu a.list-menu__item::before,
.footer .footer-block--menu a.list-menu__item::after {
  content: none;
  display: none;
}
.footer .footer-block--menu a.list-menu__item:hover {
  background: var(--lisbon-mustard);
  border-color: rgba(30, 95, 168, 0.35);
  color: var(--lisbon-ink);
  text-decoration: none;
}
/* the copyright line sits on the blue band too */
.footer__content-bottom {
  border-top: 0;
  margin-top: 22px;
  padding-top: 0;
}
.footer__copyright {
  display: inline-block;
  padding: 9px 14px;
  background: rgba(250, 247, 240, 0.97);
  border: 1px solid rgba(184, 201, 224, 0.9);
  border-radius: 2px;
}
.footer__copyright,
.footer__copyright .copyright__content,
.footer__copyright a {
  color: var(--lisbon-ink);
  font-family: var(--lisbon-sans);
  font-size: 1.3rem;
}
/* localization widgets at the very bottom */
.footer .footer__localization,
.footer .footer__localization * {
  color: var(--lisbon-ink);
}
.footer__localization {
  background: rgba(250, 247, 240, 0.97);
  border: 1px solid rgba(184, 201, 224, 0.9);
  border-radius: 2px;
  padding: 6px 10px;
}

@media screen and (min-width: 750px) {
  .footer .footer-block {
    padding: 20px 22px 22px;
  }
}
@media screen and (max-width: 749px) {
  .footer .footer-block {
    border-width: 8px;
    border-image-width: 8px;
    padding: 14px 14px 16px;
  }
  .footer .footer-block--menu a.list-menu__item {
    padding: 10px 12px;
  }
}


/* --------------------------------------------------------------------------
   Policy pages : Contact Information / Legal Notice / Terms of Service /
   Privacy / Refund / Shipping. The copy used to sit straight on the tiled
   wall. Every policy page now gets one solid paper sheet behind all text,
   so the wall only shows around the edges.
   -------------------------------------------------------------------------- */
.shopify-policy__container {
  box-sizing: border-box;
  max-width: 900px;
  margin: 40px auto 56px;
  padding: 0;
  background: transparent;
}
.shopify-policy__title {
  background: #FFFDF8;
  border: 12px solid transparent;
  border-image: var(--lisbon-tile) 26 round;
  border-image-width: 12px;
  border-radius: 0;
  box-sizing: border-box;
  margin: 0 0 18px;
  padding: 26px 34px 22px;
}
.shopify-policy__title h1 {
  color: var(--lisbon-cobalt);
  font-family: var(--lisbon-serif);
  font-weight: 400;
  font-size: 3.2rem;
  line-height: 1.2;
  margin: 0;
}
.shopify-policy__body {
  background: #FFFDF8;
  border: 12px solid transparent;
  border-image: var(--lisbon-tile) 26 round;
  border-image-width: 12px;
  border-radius: 0;
  box-sizing: border-box;
  padding: 32px 34px 36px;
}
/* the sheet itself is opaque, so no wall texture can ever show through the copy */
.shopify-policy__body .rte,
.shopify-policy__body .rte > div {
  background: transparent;
  color: var(--lisbon-ink);
  font-family: var(--lisbon-sans);
  font-size: 1.55rem;
  line-height: 1.72;
}
.shopify-policy__body .rte p,
.shopify-policy__body .rte li,
.shopify-policy__body .rte span,
.shopify-policy__body .rte div {
  color: var(--lisbon-ink);
  opacity: 1;
}
.shopify-policy__body .rte h1,
.shopify-policy__body .rte h2,
.shopify-policy__body .rte h3,
.shopify-policy__body .rte h4 {
  color: var(--lisbon-cobalt);
  font-family: var(--lisbon-serif);
  font-weight: 400;
  line-height: 1.3;
  margin: 26px 0 10px;
}
.shopify-policy__body .rte h2 { font-size: 2.2rem; }
.shopify-policy__body .rte h3 { font-size: 1.9rem; }
.shopify-policy__body .rte > div > h2:first-child,
.shopify-policy__body .rte > h2:first-child { margin-top: 0; }
.shopify-policy__body .rte a {
  color: var(--lisbon-cobalt);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.shopify-policy__body .rte ul,
.shopify-policy__body .rte ol {
  padding-left: 2.2rem;
}
.shopify-policy__body .rte li { margin-bottom: 6px; }
.shopify-policy__body .rte hr {
  border: 0;
  border-top: 1px solid var(--lisbon-hairline);
  margin: 26px 0;
}
.shopify-policy__body .rte table {
  width: 100%;
  border-collapse: collapse;
}
.shopify-policy__body .rte th,
.shopify-policy__body .rte td {
  border: 1px solid var(--lisbon-hairline);
  padding: 8px 10px;
  text-align: left;
}
.shopify-policy__body .rte th {
  background: var(--lisbon-paper-2);
  color: var(--lisbon-cobalt);
  font-family: var(--lisbon-sans);
  font-weight: 700;
}

@media screen and (min-width: 750px) {
  .shopify-policy__container { max-width: 900px; }
}
@media screen and (max-width: 749px) {
  .shopify-policy__container {
    max-width: 100%;
    margin: 20px 12px 32px;
  }
  .shopify-policy__title {
    border-width: 9px;
    border-image-width: 9px;
    padding: 18px 18px 16px;
    margin-bottom: 12px;
  }
  .shopify-policy__title h1 { font-size: 2.4rem; }
  .shopify-policy__body {
    border-width: 9px;
    border-image-width: 9px;
    padding: 20px 16px 22px;
  }
  .shopify-policy__body .rte,
  .shopify-policy__body .rte > div { font-size: 1.45rem; line-height: 1.66; }
  .shopify-policy__body .rte h2 { font-size: 1.9rem; }
  .shopify-policy__body .rte h3 { font-size: 1.7rem; }
  .shopify-policy__body .rte ul,
  .shopify-policy__body .rte ol { padding-left: 1.8rem; }
}


/* --------------------------------------------------------------------------
   Product page : the Product information column used to sit straight on the
   tiled wall in cobalt on pattern. It is now one solid paper sheet, so every
   title, price, accordion and description reads on warm white.
   -------------------------------------------------------------------------- */
.product__info-wrapper {
  box-sizing: border-box;
  background: #FFFDF8;
  border: 12px solid transparent;
  border-image: var(--lisbon-tile) 26 round;
  border-image-width: 12px;
  border-radius: 0;
  padding: 26px 30px 30px;
}
/* the sheet is opaque, nothing patterned can show behind the copy */
.product__info-wrapper .product__info-container,
.product__info-wrapper product-info,
.product__info-wrapper .product__title,
.product__info-wrapper .product__text,
.product__info-wrapper .product-page-price,
.product__info-wrapper .price,
.product__info-wrapper .product__description,
.product__info-wrapper .product__accordion,
.product__info-wrapper .accordion,
.product__info-wrapper .accordion__content,
.product__info-wrapper .rating-stars {
  background: transparent;
}
.product__info-wrapper .product__title,
.product__info-wrapper .product__title .h1,
.product__info-wrapper .product__title h1,
.product__info-wrapper .product__title h2 {
  color: var(--lisbon-cobalt);
  font-family: var(--lisbon-serif);
  font-weight: 400;
}
.product__info-wrapper .product__text,
.product__info-wrapper .product__text p,
.product__info-wrapper .product__description,
.product__info-wrapper .product__description p,
.product__info-wrapper .accordion__content,
.product__info-wrapper .accordion__content p,
.product__info-wrapper .accordion__content li,
.product__info-wrapper .price,
.product__info-wrapper .price__container,
.product__info-wrapper .price-item,
.product__info-wrapper .product__inventory {
  color: var(--lisbon-ink);
  opacity: 1;
}
.product__info-wrapper .product__description,
.product__info-wrapper .product__description p,
.product__info-wrapper .accordion__content,
.product__info-wrapper .accordion__content p {
  font-family: var(--lisbon-sans);
  font-size: 1.5rem;
  line-height: 1.68;
}
.product__info-wrapper .accordion__title,
.product__info-wrapper summary .accordion__title,
.product__info-wrapper summary h2 {
  color: var(--lisbon-cobalt);
  font-family: var(--lisbon-sans);
}
.product__info-wrapper .accordion__content a,
.product__info-wrapper .product__description a {
  color: var(--lisbon-cobalt);
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* accordion rows get their own hairline so they read as one column */
.product__info-wrapper .product__accordion {
  border-top: 1px solid var(--lisbon-hairline);
}
.product__info-wrapper .product__accordion:last-of-type {
  border-bottom: 1px solid var(--lisbon-hairline);
}

@media screen and (min-width: 750px) {
  .product__info-wrapper {
    padding: 30px 34px 34px;
  }
}
@media screen and (max-width: 749px) {
  .product__info-wrapper {
    border-width: 9px;
    border-image-width: 9px;
    padding: 18px 16px 20px;
    margin-top: 14px;
  }
  .product__info-wrapper .product__description,
  .product__info-wrapper .product__description p,
  .product__info-wrapper .accordion__content,
  .product__info-wrapper .accordion__content p {
    font-size: 1.45rem;
    line-height: 1.64;
  }
}


/* --------------------------------------------------------------------------
   Product photography is shot square (2048x2048) and must never be chopped.
   Every product / collection / hero image box therefore letterboxes instead of
   cropping, and the empty part of the box reads as the warm paper stock.
   -------------------------------------------------------------------------- */
[id$="__featured_collection_zcTw3P"] .card__media,
[id$="__collection_list_xX4KRW"] .card__media,
[id$="__featured_collection_zcTw3P"] .card__media .media,
[id$="__collection_list_xX4KRW"] .card__media .media,
[id$="__image_banner_hero"] .banner__media {
  background-color: #FFFDF8;
}
[id$="__featured_collection_zcTw3P"] .card__media img,
[id$="__collection_list_xX4KRW"] .card__media img,
[id$="__image_banner_hero"] .banner__media img {
  object-fit: contain;
  object-position: center;
}
/* the poster frame stays on the card, not on the letterboxed photo */
[id$="__featured_collection_zcTw3P"] .card__media,
[id$="__collection_list_xX4KRW"] .card__media {
  border: 1px solid var(--lisbon-hairline);
}
/* product page thumbnails and main image: same rule */
.product__media img,
.thumbnail img,
.product__media-list img {
  object-fit: contain;
}
.product__media,
.thumbnail {
  background-color: #FFFDF8;
}


/* image-with-text media on phones: match the square source exactly so the
   product shot is never shaved by the box height */
@media screen and (max-width: 749px) {
  .image-with-text__media.image-with-text__media--adapt,
  .image-with-text__media.media {
    aspect-ratio: 1 / 1;
    height: auto;
  }
  .image-with-text__media img {
    object-fit: contain;
    background-color: #FFFDF8;
  }
}