/* Editorial Commerce: the edit after idea three, the Shop links on gift guides, the ShopMy embed, the Stay22 line.
   Inherits the magazine tokens (--je-* from Journey Editorial, --ss-* from Streetstylis Editorial) with plain fallbacks. */
.ec-edit { --ec-ink: var(--je-ink, var(--ss-ink, #111)); --ec-stone: var(--je-stone, var(--ss-stone, #6b6b6b)); --ec-hair: var(--je-hair, var(--ss-hair, #e6e2dc)); --ec-accent: var(--je-accent, var(--ss-accent, #111)); --ec-sans: var(--je-sans, var(--ss-sans, "Inter", system-ui, -apple-system, "Segoe UI", sans-serif)); --ec-display: var(--je-display, var(--ss-display, "Playfair Display", Georgia, serif));
  margin: 2em 0; padding: 18px 0 10px; border-top: 1px solid var(--ec-ink); border-bottom: 1px solid var(--ec-hair); font-family: var(--ec-sans); clear: both; }
.ec-edit__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.ec-edit__kicker { font: 600 11px/1 var(--ec-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--ec-ink); }
.ec-edit__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 16px; }
.ec-edit--n1 .ec-edit__grid { grid-template-columns: minmax(0, 220px); }
.ec-edit--n2 .ec-edit__grid { grid-template-columns: repeat(2, minmax(0, 220px)); }
.ec-tile__img { max-width: 220px; }
.ec-tile { display: flex; flex-direction: column; min-width: 0; }
.ec-tile__img { display: block; aspect-ratio: 4 / 5; background: #f6f4f0 center / contain no-repeat; border: 1px solid var(--ec-hair); margin-bottom: 10px; }
.ec-tile__title { font-family: var(--ec-display); font-size: 16px; line-height: 1.3; color: var(--ec-ink) !important; text-decoration: none !important; margin-bottom: 8px; display: block; }
.ec-tile__title:hover { color: var(--ec-accent) !important; }
.ec-tile__cta { display: inline-block; align-self: flex-start; font: 600 11px/1 var(--ec-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--ec-ink) !important; text-decoration: none !important; border: 1px solid var(--ec-ink); padding: 9px 12px; margin-top: auto; }
.ec-tile__cta:hover { background: var(--ec-ink); color: #fff !important; }
.ec-edit__disc { font: 400 12px/1.5 var(--ec-sans); color: var(--ec-stone); margin-top: 14px; }
.ec-edit__embed iframe { width: 100%; min-height: 380px; border: 0; display: block; }
@media (max-width: 640px) { .ec-edit__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 10px; } .ec-tile__title { font-size: 14px; } .ec-tile__cta { padding: 8px 8px; letter-spacing: .08em; font-size: 10px; } }
@media (max-width: 400px) { .ec-edit__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Shop link under one idea (gift guides, finds) */
.ec-item { margin: 10px 0 1.6em; font-family: var(--je-sans, var(--ss-sans, system-ui, sans-serif)); clear: both; }
.ec-item__link { display: flex; align-items: center; gap: 14px; text-decoration: none !important; border: 1px solid var(--je-hair, #e6e2dc); padding: 10px 14px 10px 10px; color: var(--je-ink, #111) !important; }
.ec-item__link:hover { border-color: var(--je-ink, #111); }
.ec-item__img { flex: 0 0 56px; width: 56px; height: 56px; background: #f6f4f0 center / contain no-repeat; border: 1px solid var(--je-hair, #e6e2dc); }
.ec-item__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ec-item__cta { font: 600 10.5px/1 var(--je-sans, system-ui, sans-serif); letter-spacing: .14em; text-transform: uppercase; color: var(--je-accent, #111); }
.ec-item__title { font: 400 14px/1.3 var(--je-sans, system-ui, sans-serif); color: var(--je-ink, #111); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ec-item__arrow { margin-left: auto; color: var(--je-stone, #6b6b6b); }

/* Stay22 line on destination stories */
.ec-stay { margin: 1.2em 0 1.6em; padding: 12px 16px; border-left: 3px solid var(--je-accent, #111); background: var(--je-cream, #faf8f4); font-family: var(--je-sans, system-ui, sans-serif); }
.ec-stay__kicker { display: block; font: 600 10.5px/1 var(--je-sans, system-ui, sans-serif); letter-spacing: .14em; text-transform: uppercase; color: var(--je-stone, #6b6b6b); margin-bottom: 6px; }
.ec-stay__link { font: 500 15px/1.4 var(--je-sans, system-ui, sans-serif); color: var(--je-ink, #111) !important; text-decoration: none !important; }
.ec-stay__link:hover { color: var(--je-accent, #111) !important; }

.ec-disclosure-top { font: 400 11px/1.5 var(--je-sans, var(--ss-sans, var(--sse-sans, system-ui, sans-serif))) !important; color: var(--je-stone, var(--sse-stone, #8a8a8a)); margin: 0 0 14px !important; padding: 0 !important; letter-spacing: .01em; text-transform: none; }
.ec-disclosure-top::first-letter, .ec-disclosure-top:first-letter { float: none !important; font-size: inherit !important; font-weight: inherit !important; line-height: inherit !important; margin: 0 !important; text-transform: none !important; }
.ec-disclosure-top a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* compact byline: the theme meta above the image is hidden when a byline sits in the story; the byline itself becomes one tight line */
body:has(.sse-byline) .hero-section .entry-meta, body:has(.sse-byline) .entry-header .entry-meta, body:has(.je-byline) .hero-section .entry-meta, body:has(.je-byline) .entry-header .entry-meta { display: none !important; }
body:has(.sse-byline) .hero-section .entry-header, body:has(.sse-byline) .hero-section { margin-bottom: 8px !important; padding-bottom: 0 !important; }
.sse-byline { margin: 0 0 8px !important; padding: 0 0 8px !important; gap: 10px !important; font-size: 11.5px !important; }
.sse-byline__photo { flex: 0 0 32px !important; width: 32px !important; height: 32px !important; }
.sse-byline__photo img { width: 32px !important; height: 32px !important; }
.sse-byline__text { display: flex !important; flex-wrap: wrap; align-items: baseline; gap: 0 12px !important; }
.sse-byline__text > * { margin: 0 !important; }

/* the collection rendered by the plugin: instant, no iframe */
.ec-shop .ec-shop__row { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding: 2px 0 8px; scrollbar-width: thin; }
.ec-shop__tile { flex: 0 0 calc(25% - 11px); min-width: 150px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 7px; text-align: center; }
.ec-shop__img { display: block; background: #f6f4f0; border: 1px solid var(--je-hair, #e6e2dc); }
.ec-shop__img img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; }
.ec-shop__brand { font: 600 10px/1.2 var(--je-sans, var(--ec-sans, system-ui, sans-serif)); letter-spacing: .12em; text-transform: uppercase; color: var(--je-stone, #6b6b6b); margin-top: 4px; }
.ec-shop__title { font: 400 13px/1.35 var(--je-sans, var(--ec-sans, system-ui, sans-serif)); color: var(--je-ink, #111) !important; text-decoration: none !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.7em; }
.ec-shop__cta { margin-top: auto; display: block; font: 600 10.5px/1 var(--je-sans, var(--ec-sans, system-ui, sans-serif)); letter-spacing: .14em; text-transform: uppercase; padding: 12px 0; background: #f3f1ed; color: var(--je-ink, #111) !important; text-decoration: none !important; }
.ec-shop__cta:hover { background: var(--je-ink, #111); color: #fff !important; }
@media (max-width: 700px) { .ec-shop__tile { flex: 0 0 44%; min-width: 0; } }

/* fact boxes inside the stories (pills, "You need", booking button): the theme's reading size and list markers must not reach them. :not(#ec) = id-level specificity */
div[style*="fbf8f7"]:not(#ec) { padding: 14px 16px !important; margin: 14px 0 22px !important; font-family: var(--je-sans, var(--sse-sans, var(--ec-sans, system-ui, sans-serif))) !important; }
div[style*="fbf8f7"] ul[style]:not(#ec) { list-style: none !important; display: flex !important; flex-wrap: wrap; gap: 6px !important; margin: 0 0 10px !important; padding: 0 !important; }
div[style*="fbf8f7"] ul[style] li[style]:not(#ec) { list-style: none !important; display: inline-block !important; font-family: inherit !important; font-size: 11.5px !important; line-height: 1.3 !important; font-weight: 600 !important; letter-spacing: .02em !important; margin: 0 !important; padding: 4px 11px !important; }
div[style*="fbf8f7"] ul[style] li[style]:not(#ec)::marker { content: "" !important; font-size: 0 !important; color: transparent !important; }
div[style*="fbf8f7"] ul[style] li[style]:not(#ec)::before, div[style*="fbf8f7"] ul[style] li[style]:not(#ec)::after { content: none !important; display: none !important; }
div[style*="fbf8f7"] p:not(#ec), div[style*="fbf8f7"] p[style]:not(#ec) { font-family: inherit !important; font-size: 13.5px !important; line-height: 1.5 !important; margin: 0 !important; color: #5c4848 !important; }
div[style*="fbf8f7"] p a[style*="999px"]:not(#ec) { font-family: inherit !important; font-size: 12.5px !important; line-height: 1 !important; font-weight: 600 !important; padding: 10px 18px !important; margin-top: 4px; display: inline-block !important; }

/* two pieces of one look under the pin */
.ec-item--pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ec-item--pair .ec-item__link { min-width: 0; }
@media (max-width: 640px) { .ec-item--pair { grid-template-columns: 1fr; gap: 8px; } }

/* pin and its shop link as one block: the ad network places its slot after the block, so the reader sees pin, product, ad, text */
.ec-look { margin: 0 0 1.4em; }
.ec-look > p:empty { display: none; }
.ec-look .ppe-embed, .ec-look figure, .ec-look > p { margin: 0 !important; }
.ec-look .ppe-embed iframe { display: block; }
.ec-look .ec-item { margin: 6px 0 0 !important; }
.ec-look .ec-item--pair { margin-top: 6px !important; }

/* the theme paints a cream background on every pin wrapper; a loaded Pinterest iframe is transparent, so the wrapper showed as a band under the card */
.ppe-embed.ppe-native:not(#ec), .ppe-embed.ppe-loaded:not(#ec), .ppe-embed.ppe-auto:not(#ec), .ec-look .ppe-embed:not(#ec) { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }