/* Built by tools/build-list-look.php from tools/local-web/look (article.css, article-end.css, article-polish.css). Do not edit here.
   Loaded after list-look.css on news articles, which carries the footer. */
/* Local only: news articles still on WordPress (/entertainment/<slug>/look) in the approved list design, look 1 "Poster Tint".
   look.css and designs.css (design 1) are loaded first, exactly as on a list page, so the header, the title band (.lookHero),
   the colours, fonts and the Recommended boxes are the list's own. This file only fits the parts that articles have and lists
   do not: the WordPress byline, the article text column, its pictures and headings, the writer box, previous and next,
   Similar Posts, comments and the sidebar, which moves below the article. look.js (post) moves and marks the page's elements. */
[data-kind="post"] {
  --a-text: "Barlow", "Mulish", sans-serif; --a-cap: "Barlow Condensed", "Arial Narrow", sans-serif;
}
[data-kind="post"] body, [data-kind="post"] #wrapper, [data-kind="post"] #inner-wrap, [data-kind="post"] #primary, [data-kind="post"] .content-container, [data-kind="post"] #main, [data-kind="post"] .content-wrap { background: var(--bg) !important; }

/* Title band: the list's .lookHero, with the article's own h1 and byline in place of the list's. */
html body .lookHero h1.entry-title { margin: 0; padding: 0; max-width: 18ch; color: #fff !important; font: 800 clamp(40px, 7.4vw, 78px)/.98 var(--display) !important; text-align: left; text-wrap: balance; }
html body .lookHero .entry-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0; color: #fff; font: 600 14px var(--body); }
html body .lookHero .entry-meta > span::after { display: none !important; }
html body .lookHero .entry-meta a, html body .lookHero .entry-meta .author { color: #fff !important; font-weight: 800; text-decoration: none; }
.lookHero .entry-meta .posted-by { display: inline-flex; align-items: center; gap: 8px; }
.lookHero .entry-meta .author-avatar { position: relative !important; display: inline-block !important; flex: none; width: 28px !important; height: 28px !important; margin: 0; }
.lookHero .entry-meta .author-avatar .author-image { position: absolute; inset: 0; width: 28px; height: 28px; }
.lookHero .entry-meta .author-avatar img { position: static !important; width: 28px; height: 28px; border-radius: 50%; }
.lookHero .entry-meta .author-avatar .image-size-ratio { display: none; }
.lookHero .entry-meta .posted-on, .lookHero .entry-meta .kadence-svg-iconset { display: none; }
.lookHero .entry-meta .updated-on::before { content: "-"; margin-right: 10px; }
.lookHero .entry-meta .meta-label { margin-right: 4px; }

/* The article: one white card, like the list's introduction and entries, with the sidebar below. */
[data-kind="post"] .content-container.site-container { display: block !important; max-width: 1140px; padding: 26px 16px 0; }
@media (min-width: 1025px) { [data-kind="post"] .content-container.site-container { max-width: none; padding-left: calc(8.33vw + 15px); padding-right: calc(8.33vw + 15px); } }
[data-kind="post"] #primary, [data-kind="post"] #secondary { width: auto !important; max-width: 760px; margin: 0; padding: 0; }
[data-kind="post"] article.single-entry { background: var(--surface) !important; border: 1px solid var(--line); border-radius: 6px; box-shadow: none; }
[data-kind="post"] article.single-entry .entry-content-wrap { padding: 22px 22px 8px; }

/* Text: the list's introduction and entry text (Barlow 18px), its large first letter and its links. */
[data-kind="post"] .entry-content { color: var(--ink); }
[data-kind="post"] .entry-content .postGap, [data-kind="post"] .entry-content .postLead { display: none; }
html[data-kind="post"] body .entry-content > p { margin: 0 0 15px !important; max-width: none; color: var(--ink) !important; font: 400 18px/1.7 var(--a-text) !important; }
[data-kind="post"] .entry-content .postFirst::first-letter { float: left; margin: 5px 8px 0 0; color: var(--rose); font: 800 76px/.8 var(--a-cap); }
[data-kind="post"] .entry-content a { color: var(--link) !important; text-underline-offset: 3px; }
[data-kind="post"] .entry-content strong, [data-kind="post"] .entry-content em { color: inherit !important; }
/* Headings in the list's display type, like its entry names. */
[data-kind="post"] .entry-content > h2 { margin: 34px 0 14px; padding: 0; border: 0; color: var(--ink); font: 800 clamp(30px, 4.2vw, 40px)/1.03 var(--display); text-wrap: balance; }
[data-kind="post"] .entry-content > h3 { margin: 26px 0 12px; color: var(--ink); font: 800 clamp(24px, 3vw, 30px)/1.05 var(--display); }
[data-kind="post"] .entry-content h2 strong, [data-kind="post"] .entry-content h3 strong { font-weight: inherit; }
.postNum { color: var(--rose); }
[data-kind="post"] .entry-content .postFig { margin: 6px 0 20px !important; }
[data-kind="post"] .entry-content .postFig img { display: block; width: 100%; height: auto; border-radius: 6px; }
/* The list's Recommended box sits in the article card with the same spacing as on a list. */
[data-kind="post"] .entry-content div.read_it { margin: 22px 0 26px; }

/* Writer, previous and next: white cards like the list's. */
[data-kind="post"] .entry-author { margin: 22px 0 0; padding: 20px 22px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; text-align: left; }
[data-kind="post"] .entry-author-profile { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 2px 16px; padding: 0 !important; min-height: 0; }
[data-kind="post"] .entry-author-profile, [data-kind="post"] .entry-author-profile * { text-align: left !important; }
[data-kind="post"] .entry-author-avatar { grid-row: 1 / span 3; }
[data-kind="post"] .entry-author-avatar, [data-kind="post"] .entry-author-avatar img { position: static !important; transform: none !important; margin: 0 !important; }
[data-kind="post"] .entry-author-avatar::before, [data-kind="post"] .entry-author-avatar::after { display: none; }
[data-kind="post"] .entry-author-avatar img { width: 64px; height: 64px; border-radius: 50%; }
[data-kind="post"] .entry-author-name { grid-column: 2; align-self: end; }
[data-kind="post"] .entry-author-name, [data-kind="post"] .entry-author-name a { margin: 0; color: var(--ink) !important; font: 800 26px/1.05 var(--display); text-decoration: none; }
[data-kind="post"] .entry-author-description { grid-column: 2; padding: 0 !important; margin: 4px 0 0 !important; }
[data-kind="post"] .entry-author-description, [data-kind="post"] .entry-author-description p { color: var(--muted); font: 400 15px/1.6 var(--body); }
[data-kind="post"] .post-navigation { margin: 18px 0 0; padding: 0; }
[data-kind="post"] .post-navigation .nav-links { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
[data-kind="post"] .post-navigation .nav-links::after, [data-kind="post"] .post-navigation .nav-links > div::after { display: none; }
[data-kind="post"] .post-navigation .nav-links > div { padding: 14px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; }
[data-kind="post"] .post-navigation a { color: var(--ink) !important; font: 800 22px/1.05 var(--display); text-decoration: none; }
[data-kind="post"] .post-navigation a:hover { color: var(--rose) !important; }
[data-kind="post"] .post-navigation .post-navigation-sub small { color: var(--muted); font: 800 11px/1.3 var(--body); letter-spacing: .1em; text-transform: uppercase; }

/* Similar Posts: one row of each post (the carousel repeats them), as white cards. */
[data-kind="post"] .entry-related { margin-top: 30px; padding: 0; background: none !important; }
[data-kind="post"] .entry-related-inner { max-width: none; padding: 0; }
[data-kind="post"] .entry-related-title { margin: 0 0 14px; color: var(--ink); font: 800 34px/1 var(--display) !important; }
[data-kind="post"] .entry-related-carousel .splide__track { overflow: visible; }
[data-kind="post"] .entry-related-carousel .splide__list { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px !important; transform: none !important; }
[data-kind="post"] .entry-related-carousel .splide__slide { width: auto !important; margin: 0 !important; }
[data-kind="post"] .entry-related-carousel .splide__slide--clone, [data-kind="post"] .entry-related-carousel .splide__arrows, [data-kind="post"] .entry-related-carousel .splide__pagination { display: none !important; }
[data-kind="post"] .entry-related article.entry { height: 100%; overflow: hidden; background: var(--surface) !important; border: 1px solid var(--line); border-radius: 6px; box-shadow: none; }
[data-kind="post"] .entry-related .post-thumbnail { display: block; height: auto !important; margin: 0; padding: 0 !important; aspect-ratio: 16 / 10; overflow: hidden; }
[data-kind="post"] .entry-related .post-thumbnail::before, [data-kind="post"] .entry-related .post-thumbnail::after { display: none; }
[data-kind="post"] .entry-related .post-thumbnail-inner { position: static; height: 100%; padding: 0; }
[data-kind="post"] .entry-related .post-thumbnail img { position: static; width: 100%; height: 100%; object-fit: cover; }
[data-kind="post"] .entry-related .entry-content-wrap { padding: 12px 14px 14px; }
[data-kind="post"] .entry-related .entry-title, [data-kind="post"] .entry-related .entry-title a { margin: 0; color: var(--ink) !important; font: 800 21px/1.05 var(--display) !important; text-decoration: none; }
[data-kind="post"] .entry-related article.entry:hover .entry-title a { color: var(--rose) !important; }
[data-kind="post"] .entry-related .entry-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 6px; }
[data-kind="post"] .entry-related .entry-meta, [data-kind="post"] .entry-related .entry-meta a { color: var(--muted) !important; font: 600 12px var(--body); }
[data-kind="post"] .entry-related .entry-meta > span::after { display: none !important; }
[data-kind="post"] .entry-related .entry-meta img, [data-kind="post"] .entry-related .entry-meta .kadence-svg-iconset { display: none; }

/* Comments and the sidebar's boxes, as white cards below. */
[data-kind="post"] .comments-area { margin-top: 30px; padding: 20px 22px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; }
[data-kind="post"] .comment-reply-title { color: var(--ink); font: 800 30px/1.05 var(--display) !important; }
[data-kind="post"] .comments-area input:not([type="checkbox"]):not([type="submit"]), [data-kind="post"] .comments-area textarea { border: 1px solid var(--line); border-radius: 6px; background: var(--bg); }
[data-kind="post"] .comments-area .submit { padding: 10px 20px; background: var(--rose) !important; border: 0; border-radius: 6px; color: #fff !important; font: 800 14px var(--body); }
[data-kind="post"] #secondary { margin-top: 30px; }
[data-kind="post"] #secondary .sidebar-inner-wrap { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
[data-kind="post"] #secondary .widget { margin: 0; padding: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; }

@media (max-width: 640px) {
  [data-kind="post"] article.single-entry .entry-content-wrap { padding: 18px 14px 4px; }
  html[data-kind="post"] body .entry-content > p { font-size: 18px !important; }
  [data-kind="post"] .post-navigation .nav-links, [data-kind="post"] .entry-related-carousel .splide__list, [data-kind="post"] #secondary .sidebar-inner-wrap { grid-template-columns: minmax(0, 1fr); }
  [data-kind="post"] .entry-author { padding-inline: 14px; }
}
/* The theme makes Similar Posts full width with negative margins; keep it in the article column. */
[data-kind="post"] .entry-related.alignfull { width: auto !important; max-width: none; margin-left: 0 !important; margin-right: 0 !important; left: auto; right: auto; transform: none; }
[data-kind="post"] .entry-related-inner-content.alignwide { width: auto !important; max-width: none; margin-left: 0 !important; margin-right: 0 !important; padding: 0 !important; }
[data-kind="post"] .entry-related-inner.content-container { padding: 0 !important; }

/* Column widths as on a list page. The list puts its content in a Bootstrap row: an empty col-lg-1, then col-lg-7
   (at 1920px the content card starts at 173px and is 1084px wide). The article and the boxes below it use the same
   start and width, so a list and an article line up exactly. Below 992px the list's column is full width, and so is this. */
[data-kind="post"] .content-container.site-container { max-width: none !important; padding: 26px 15px 0 !important; }
[data-kind="post"] #primary, [data-kind="post"] #secondary { max-width: none !important; }
@media (min-width: 992px) {
  [data-kind="post"] .content-container.site-container { padding-left: 0 !important; padding-right: 0 !important; }
  [data-kind="post"] #primary, [data-kind="post"] #secondary { width: calc((100% + 22.5px) * 7 / 12 - 40px) !important; margin-left: calc((100% + 22.5px) / 12 + 12.5px) !important; }
}

/* Breathing room inside the white card: the text no longer runs close to its edges. */
[data-kind="post"] article.single-entry .entry-content-wrap { padding: 36px 44px 20px !important; }
@media (max-width: 991px) { [data-kind="post"] article.single-entry .entry-content-wrap { padding: 30px 32px 14px !important; } }
@media (max-width: 640px) { [data-kind="post"] article.single-entry .entry-content-wrap { padding: 24px 20px 8px !important; } }
[data-kind="post"] .entry-author { padding: 26px 32px !important; }
[data-kind="post"] .comments-area { padding: 26px 32px !important; }
@media (max-width: 640px) { [data-kind="post"] .entry-author, [data-kind="post"] .comments-area { padding: 20px !important; } }

/* Local only: the premium end of a news article (/entertainment/<slug>/look), loaded after article.css.
   Writer, previous and next, Similar Posts, comments and the sidebar's boxes, in the vocabulary of list look 1:
   the dark title-band colour, the poster tint (--wash), Big Shoulders and the rose accent. */
[data-kind="post"] { --p-night: #14101c; --p-glow: color-mix(in srgb, var(--wash) 55%, var(--rose)); }

/* Writer: a dark card with a glow of the article's colour and a ringed photo. */
[data-kind="post"] .entry-author { position: relative; overflow: hidden; isolation: isolate; margin-top: 28px !important; padding: 30px 34px !important; background: var(--p-night) !important; border: 0 !important; border-radius: 10px !important; color: #fff; }
[data-kind="post"] .entry-author::before { content: ""; position: absolute; inset: -40% -10% -60% 45%; z-index: -1; background: radial-gradient(closest-side, color-mix(in srgb, var(--p-glow) 60%, transparent), transparent); filter: blur(10px); }
[data-kind="post"] .entry-author-profile { grid-template-columns: 96px minmax(0, 1fr) !important; gap: 4px 22px !important; align-items: center; }
[data-kind="post"] .entry-author-profile::before { content: "Written by"; grid-column: 2; color: #ff8db4; font: 800 11px/1 var(--body); letter-spacing: .14em; text-transform: uppercase; }
[data-kind="post"] .entry-author-avatar { grid-row: 1 / span 3; position: relative !important; width: 96px; height: 96px; padding: 4px !important; border-radius: 50%; background: conic-gradient(from 200deg, #ff4f8e, #ffb36b, #b48cff, #5ec8ff, #ff4f8e); }
[data-kind="post"] .entry-author-avatar img { display: block; width: 88px !important; height: 88px !important; border: 3px solid var(--p-night); border-radius: 50%; }
[data-kind="post"] .entry-author-name, [data-kind="post"] .entry-author-name a { color: #fff !important; font: 800 34px/1 var(--display) !important; }
[data-kind="post"] .entry-author-name a:hover { color: #ff8db4 !important; }
[data-kind="post"] .entry-author-description, [data-kind="post"] .entry-author-description p { color: rgba(255, 255, 255, .78) !important; font: 400 15.5px/1.65 var(--a-text) !important; }

/* Previous and next: large tinted cards; the whole card is the link. */
[data-kind="post"] .post-navigation { margin-top: 16px !important; }
[data-kind="post"] .post-navigation .nav-links { gap: 16px !important; }
[data-kind="post"] .post-navigation .nav-links > div { position: relative; min-height: 118px; padding: 22px 24px !important; background: color-mix(in srgb, var(--wash) 12%, #fff) !important; border: 1px solid color-mix(in srgb, var(--wash) 30%, #fff) !important; border-radius: 10px !important; transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease; }
[data-kind="post"] .post-navigation .nav-links > div:hover { background: #fff !important; transform: translateY(-3px); box-shadow: 0 20px 40px -26px rgba(20, 16, 28, .55); }
[data-kind="post"] .post-navigation a { display: block; color: var(--ink) !important; font: 800 25px/1.04 var(--display) !important; }
[data-kind="post"] .post-navigation a::after { content: ""; position: absolute; inset: 0; }
[data-kind="post"] .post-navigation .post-navigation-sub { display: block; margin-bottom: 10px; }
[data-kind="post"] .post-navigation .post-navigation-sub small { color: var(--rose) !important; font: 800 11px/1 var(--body) !important; letter-spacing: .14em; }
[data-kind="post"] .post-navigation .nav-next { text-align: right; }

/* Section titles below the article, with a rose bar. */
[data-kind="post"] .entry-related-title, [data-kind="post"] .comment-reply-title { display: flex; align-items: center; gap: 12px; }
[data-kind="post"] .entry-related-title::before, [data-kind="post"] .comment-reply-title::before { content: ""; flex: none; width: 6px; height: .9em; border-radius: 3px; background: var(--rose); }
[data-kind="post"] .entry-related { margin-top: 44px !important; }
[data-kind="post"] .entry-related-title { margin-bottom: 18px !important; font-size: 38px !important; }

/* Similar Posts: picture tiles with the title over a dark fade, lifting on hover. */
[data-kind="post"] .entry-related-carousel .splide__list { gap: 18px !important; }
[data-kind="post"] .entry-related article.entry { position: relative; aspect-ratio: 4 / 3.4; height: auto !important; border: 0 !important; border-radius: 10px !important; background: var(--p-night) !important; transition: transform .25s ease, box-shadow .25s ease; }
[data-kind="post"] .entry-related article.entry:hover { transform: translateY(-4px); box-shadow: 0 26px 46px -28px rgba(20, 16, 28, .8); }
[data-kind="post"] .entry-related .post-thumbnail { position: absolute !important; inset: 0; aspect-ratio: auto !important; }
[data-kind="post"] .entry-related .post-thumbnail img { transition: transform .5s ease; }
[data-kind="post"] .entry-related article.entry:hover .post-thumbnail img { transform: scale(1.06); }
[data-kind="post"] .entry-related .entry-content-wrap { position: absolute; inset: auto 0 0; z-index: 1; padding: 70px 16px 14px !important; background: linear-gradient(180deg, transparent, rgba(12, 9, 18, .55) 35%, rgba(12, 9, 18, .94)); pointer-events: none; }
[data-kind="post"] .entry-related .entry-content-wrap a { pointer-events: auto; }
[data-kind="post"] .entry-related .entry-title, [data-kind="post"] .entry-related .entry-title a { color: #fff !important; font: 800 23px/1.02 var(--display) !important; }
[data-kind="post"] .entry-related article.entry:hover .entry-title a { color: #ff8db4 !important; }
[data-kind="post"] .entry-related .entry-meta, [data-kind="post"] .entry-related .entry-meta a { color: rgba(255, 255, 255, .7) !important; }

/* Comments: a calm form with rose focus and a pill button. */
[data-kind="post"] .comments-area { margin-top: 44px !important; padding: 30px 34px !important; border-radius: 10px !important; }
[data-kind="post"] .comment-reply-title { font-size: 34px !important; }
[data-kind="post"] .comment-notes, [data-kind="post"] .comment-form-cookies-consent { color: var(--muted); font: 400 14px/1.5 var(--body); }
[data-kind="post"] .comments-area input:not([type="checkbox"]):not([type="submit"]), [data-kind="post"] .comments-area textarea { padding: 12px 14px; background: var(--bg) !important; border: 1px solid transparent !important; border-radius: 8px !important; font: 400 15px/1.5 var(--body); transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease; }
[data-kind="post"] .comments-area input:not([type="checkbox"]):not([type="submit"]):focus, [data-kind="post"] .comments-area textarea:focus { background: #fff !important; border-color: var(--rose) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--rose) 14%, transparent); outline: 0; }
[data-kind="post"] .comments-area .submit { padding: 13px 26px !important; background: var(--p-night) !important; border-radius: 99px !important; font: 800 14px var(--body) !important; letter-spacing: .02em; transition: background-color .15s ease, transform .15s ease; }
[data-kind="post"] .comments-area .submit:hover { background: var(--rose) !important; transform: translateY(-1px); }

/* The sidebar's boxes: the post tabs as a full-width card with pill tabs and a row of picture cards,
   and the newsletter as a dark band. */
[data-kind="post"] #secondary { margin-top: 44px !important; }
[data-kind="post"] #secondary .sidebar-inner-wrap { display: grid; grid-template-columns: minmax(0, 1fr) !important; gap: 18px !important; }
[data-kind="post"] #secondary .widget { padding: 24px 26px !important; border-radius: 10px !important; }
[data-kind="post"] #secondary .wp-block-kadence-tabs, [data-kind="post"] #secondary .kt-tabs-wrap, [data-kind="post"] #secondary .kb-row-layout-wrap, [data-kind="post"] #secondary .kt-row-column-wrap, [data-kind="post"] #secondary .wp-block-kadence-column, [data-kind="post"] #secondary .kt-inside-inner-col { width: auto !important; max-width: none !important; margin: 0 !important; }
[data-kind="post"] #secondary .kt-row-column-wrap { display: block !important; padding: 0 !important; }
[data-kind="post"] #secondary .kt-tabs-title-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px !important; padding: 0 !important; border: 0 !important; }
[data-kind="post"] #secondary .kt-tabs-title-list li { margin: 0 !important; }
[data-kind="post"] #secondary .kt-tabs-title-list li a { padding: 8px 18px !important; background: var(--bg) !important; border: 0 !important; border-radius: 99px !important; color: var(--ink) !important; font: 800 13px/1 var(--body) !important; }
[data-kind="post"] #secondary .kt-tabs-title-list li.kt-tab-title-active a { background: var(--p-night) !important; color: #fff !important; }
[data-kind="post"] #secondary .kt-tabs-content-wrap, [data-kind="post"] #secondary .kt-tab-inner-content, [data-kind="post"] #secondary .kt-tab-inner-content-inner { width: auto !important; max-width: none !important; padding: 0 !important; background: none !important; border: 0 !important; }
[data-kind="post"] #secondary .kb-posts { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
[data-kind="post"] #secondary .kb-posts article.loop-entry { margin: 0 !important; overflow: hidden; background: var(--bg) !important; border: 0; border-radius: 8px; box-shadow: none; transition: transform .2s ease; }
[data-kind="post"] #secondary .kb-posts article.loop-entry:hover { transform: translateY(-3px); }
[data-kind="post"] #secondary .kb-posts .post-thumbnail { display: block; height: auto !important; margin: 0; padding: 0 !important; aspect-ratio: 16 / 10; overflow: hidden; }
[data-kind="post"] #secondary .kb-posts .post-thumbnail::before, [data-kind="post"] #secondary .kb-posts .post-thumbnail::after { display: none; }
[data-kind="post"] #secondary .kb-posts .post-thumbnail-inner { position: static; height: 100%; padding: 0; }
[data-kind="post"] #secondary .kb-posts .post-thumbnail img { position: static; width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
[data-kind="post"] #secondary .kb-posts .entry-content-wrap { padding: 12px 14px 14px !important; }
[data-kind="post"] #secondary .kb-posts .entry-title, [data-kind="post"] #secondary .kb-posts .entry-title a { margin: 0; color: var(--ink) !important; font: 800 20px/1.05 var(--display) !important; text-decoration: none; }
[data-kind="post"] #secondary .kb-posts .entry-title a:hover { color: var(--rose) !important; }
[data-kind="post"] #secondary .kb-posts .post-more-link { display: inline-block; margin-top: 8px; padding: 0; background: none !important; border: 0; color: var(--rose) !important; font: 800 12px/1 var(--body) !important; letter-spacing: .08em; }
/* Newsletter band */
[data-kind="post"] #secondary .widget:last-child { position: relative; overflow: hidden; isolation: isolate; background: var(--p-night) !important; border: 0 !important; color: #fff; }
[data-kind="post"] #secondary .widget:last-child::before { content: ""; position: absolute; inset: -40% 50% -40% -10%; z-index: -1; background: radial-gradient(closest-side, color-mix(in srgb, var(--p-glow) 50%, transparent), transparent); filter: blur(8px); }
[data-kind="post"] #secondary .widget:last-child h1, [data-kind="post"] #secondary .widget:last-child h2, [data-kind="post"] #secondary .widget:last-child h3, [data-kind="post"] #secondary .widget:last-child h4 { margin: 0 0 14px !important; color: #fff !important; font: 800 32px/1.05 var(--display) !important; text-align: left !important; }
[data-kind="post"] #secondary .widget:last-child form { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; max-width: 560px; }
[data-kind="post"] #secondary .widget:last-child .kb-form-field, [data-kind="post"] #secondary .widget:last-child .kadence-blocks-form-field { flex: 1 1 240px; margin: 0 !important; padding: 0 !important; width: auto !important; }
[data-kind="post"] #secondary .widget:last-child input[type="email"], [data-kind="post"] #secondary .widget:last-child input[type="text"] { width: 100%; height: 48px; padding: 0 18px; background: rgba(255, 255, 255, .1) !important; border: 1px solid rgba(255, 255, 255, .22) !important; border-radius: 99px !important; color: #fff !important; font: 500 15px var(--body); }
[data-kind="post"] #secondary .widget:last-child input::placeholder { color: rgba(255, 255, 255, .6); }
[data-kind="post"] #secondary .widget:last-child button, [data-kind="post"] #secondary .widget:last-child input[type="submit"] { height: 48px; padding: 0 26px !important; background: var(--rose) !important; border: 0 !important; border-radius: 99px !important; color: #fff !important; font: 800 14px var(--body) !important; box-shadow: none !important; }

@media (max-width: 991px) { [data-kind="post"] #secondary .kb-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  [data-kind="post"] .entry-author { padding: 24px 20px !important; }
  [data-kind="post"] .entry-author-profile { grid-template-columns: 72px minmax(0, 1fr) !important; gap: 4px 16px !important; }
  [data-kind="post"] .entry-author-avatar { width: 72px; height: 72px; }
  [data-kind="post"] .entry-author-avatar img { width: 64px !important; height: 64px !important; }
  [data-kind="post"] .entry-author-name, [data-kind="post"] .entry-author-name a { font-size: 28px !important; }
  [data-kind="post"] .entry-author-description { grid-column: 1 / -1 !important; margin-top: 12px !important; }
  [data-kind="post"] .post-navigation .nav-next { text-align: left; }
  [data-kind="post"] .entry-related article.entry { aspect-ratio: 16 / 11; }
  [data-kind="post"] .comments-area, [data-kind="post"] #secondary .widget { padding: 22px 18px !important; }
  [data-kind="post"] #secondary .kb-posts { grid-template-columns: minmax(0, 1fr); }
}

/* Writer card grid: photo on the left across all rows; label, name and bio stacked on the right. */
[data-kind="post"] .entry-author-avatar { grid-column: 1 !important; grid-row: 1 / span 3 !important; align-self: start; }
[data-kind="post"] .entry-author-profile::before { grid-row: 1; align-self: end; }
[data-kind="post"] .entry-author-name { grid-row: 2; grid-column: 2; }
[data-kind="post"] .entry-author-description { grid-row: 3; }
[data-kind="post"] .entry-author-follow { display: none; }
@media (max-width: 640px) { [data-kind="post"] .entry-author-description { grid-row: 4; } [data-kind="post"] .entry-author-avatar { grid-row: 1 / span 2 !important; } }
/* Taller tiles so the picture shows above the title. */
[data-kind="post"] .entry-related article.entry { aspect-ratio: 3 / 3.3 !important; }
@media (max-width: 640px) { [data-kind="post"] .entry-related article.entry { aspect-ratio: 16 / 12 !important; } }

/* The sidebar sits inside the article column, so it takes that column width, not a second one. */
@media (min-width: 992px) { [data-kind="post"] #secondary { width: auto !important; margin-left: 0 !important; } }
[data-kind="post"] .content-container.site-container .content-container { display: block !important; }
/* Newsletter: the theme gives its inner row a light background; the band is dark throughout. */
[data-kind="post"] #secondary .widget:last-child .kb-row-layout-wrap { background: none !important; padding: 0 !important; }
[data-kind="post"] #secondary .widget:last-child .kt-inside-inner-col { padding: 0 !important; }
[data-kind="post"] #secondary .widget:last-child input.kb-field { flex: 1 1 260px; width: auto !important; }
[data-kind="post"] #secondary .widget:last-child .kb-forms-submit { width: auto !important; }
[data-kind="post"] #secondary .widget:last-child .kb-submit-field, [data-kind="post"] #secondary .widget:last-child .kadence-blocks-form-field.kb-submit-field { flex: 0 0 auto !important; width: auto !important; }

/* Newsletter text is light on the dark band, whatever colour the theme gave its heading. */
[data-kind="post"] #secondary .widget:last-child *:not(input):not(button):not(svg):not(path) { color: #fff !important; }
[data-kind="post"] #secondary .widget:last-child .wp-block-kadence-advancedheading, [data-kind="post"] #secondary .widget:last-child [class*="kt-adv-heading"] { margin: 0 0 16px !important; font: 800 32px/1.05 var(--display) !important; text-align: left !important; }
[data-kind="post"] #secondary .widget:last-child .kb-forms-submit { display: inline-flex !important; align-items: center; justify-content: center; }

/* The theme pins Next to a second column; on phones both cards stack. */
@media (max-width: 640px) { [data-kind="post"] .post-navigation .nav-links { grid-template-columns: minmax(0, 1fr) !important; } [data-kind="post"] .post-navigation .nav-links > div { grid-column: auto !important; min-height: 0; } }

/* Similar Posts show the picture and title only. */
[data-kind="post"] .entry-related .entry-meta { display: none !important; }
[data-kind="post"] .entry-related .entry-content-wrap { padding-bottom: 16px !important; }

/* The title spreads across the same width as the article card below it, instead of breaking every few words. */
html body .lookHero h1.entry-title { max-width: none !important; text-wrap: pretty; }
@media (min-width: 992px) { html body .lookHero h1.entry-title { max-width: calc((100vw - 15px + 22.5px) * 7 / 12 - 40px) !important; } }

/* Local only: finishing touches for news articles (/entertainment/<slug>/look), loaded last.
   1. The byline under the title as a glass pill: ringed photo, writer, and the updated date with a calendar mark.
   2. Every state of the newsletter form on its dark band: focus, error, warning, loading and success. */

/* 1. Byline */
html body .lookHero .entry-meta { justify-self: start; display: inline-flex !important; flex-wrap: wrap; align-items: center; gap: 6px 0 !important; padding: 6px 18px 6px 6px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .18); border-radius: 99px; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 14px 30px -18px rgba(0, 0, 0, .7); font: 600 14px/1.2 var(--body) !important; }
html body .lookHero .entry-meta .posted-by { gap: 10px; padding-right: 14px; }
.lookHero .entry-meta .author-avatar { width: 34px !important; height: 34px !important; padding: 2px; border-radius: 50%; background: conic-gradient(from 200deg, #ff4f8e, #ffb36b, #b48cff, #5ec8ff, #ff4f8e); }
.lookHero .entry-meta .author-avatar .author-image { inset: 2px; width: 30px; height: 30px; }
.lookHero .entry-meta .author-avatar img { width: 30px !important; height: 30px !important; border: 2px solid #14101c; }
html body .lookHero .entry-meta .posted-by .author { font-weight: 800; letter-spacing: .01em; }
html body .lookHero .entry-meta .posted-by .author::before { content: "By "; color: rgba(255, 255, 255, .65); font-weight: 600; }
.lookHero .entry-meta .updated-on { display: inline-flex; align-items: center; gap: 7px; padding-left: 14px; border-left: 1px solid rgba(255, 255, 255, .22); color: #fff; }
.lookHero .entry-meta .updated-on::before { content: ""; width: 15px; height: 15px; margin: 0; background: #ff8db4; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M7 3v3M17 3v3M4 9h16M5 5h14a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M7 3v3M17 3v3M4 9h16M5 5h14a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1z'/%3E%3C/svg%3E") center / contain no-repeat; }
.lookHero .entry-meta .updated-on .meta-label { margin-right: 0; color: rgba(255, 255, 255, .65); font-weight: 600; }
.lookHero .entry-meta .updated-on time { color: #fff; font-weight: 700; }
@media (max-width: 640px) {
  html body .lookHero .entry-meta { padding: 5px 14px 5px 5px; font-size: 13px !important; }
  html body .lookHero .entry-meta .posted-by { padding-right: 10px; }
  .lookHero .entry-meta .updated-on { padding-left: 10px; }
}

/* 2. Newsletter form states. The form's own script adds these classes; the white-text rule must not reach them. */
[data-kind="post"] #secondary .widget:last-child input[type="email"]:focus, [data-kind="post"] #secondary .widget:last-child input[type="text"]:focus { background: rgba(255, 255, 255, .16) !important; border-color: #ff8db4 !important; box-shadow: 0 0 0 4px rgba(255, 79, 142, .22) !important; outline: 0 !important; }
[data-kind="post"] #secondary .widget:last-child input:-webkit-autofill { -webkit-text-fill-color: #fff; -webkit-box-shadow: 0 0 0 40px #2a1f3a inset !important; caret-color: #fff; }
/* A field with a problem, and its short message under it */
[data-kind="post"] #secondary .widget:last-child .has-error input, [data-kind="post"] #secondary .widget:last-child input.has-error { border-color: #ff6b7d !important; box-shadow: 0 0 0 4px rgba(255, 107, 125, .2) !important; }
[data-kind="post"] #secondary .widget:last-child .kb-form-error-msg { display: block; margin: 8px 0 0 18px !important; padding: 0 !important; background: none !important; border: 0 !important; color: #ff9aa8 !important; font: 700 12.5px/1.3 var(--body) !important; text-align: left !important; }
[data-kind="post"] #secondary .widget:last-child .kb-form-error-msg::before { content: "! "; }
/* The message under the form: warning (something to fix) or success (subscribed) */
[data-kind="post"] #secondary .widget:last-child .kadence-blocks-form-message { flex: 1 0 100%; order: 10; display: flex; align-items: center; gap: 10px; margin: 6px 0 0 !important; padding: 11px 16px !important; background: rgba(255, 107, 125, .14) !important; border: 1px solid rgba(255, 107, 125, .35) !important; border-radius: 12px !important; color: #ffd3da !important; font: 600 14px/1.4 var(--body) !important; text-align: left !important; box-shadow: none !important; }
[data-kind="post"] #secondary .widget:last-child .kadence-blocks-form-message * { color: inherit !important; font: inherit !important; }
[data-kind="post"] #secondary .widget:last-child .kadence-blocks-form-message::before { content: "!"; flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #ff6b7d; color: #14101c; font: 900 13px/1 var(--body); }
[data-kind="post"] #secondary .widget:last-child .kadence-blocks-form-message.kadence-blocks-form-success { background: rgba(63, 211, 155, .14) !important; border-color: rgba(63, 211, 155, .4) !important; color: #c9f7e4 !important; }
[data-kind="post"] #secondary .widget:last-child .kadence-blocks-form-message.kadence-blocks-form-success::before { content: "\2713"; background: #3fd39b; }
[data-kind="post"] #secondary .widget:last-child .kb-form-success { padding: 18px 20px !important; background: rgba(63, 211, 155, .14) !important; border: 1px solid rgba(63, 211, 155, .4) !important; border-radius: 12px !important; color: #c9f7e4 !important; font: 700 15px/1.4 var(--body) !important; }
/* While sending: the button dims and shows a small spinner */
[data-kind="post"] #secondary .widget:last-child .kb-form-loading button, [data-kind="post"] #secondary .widget:last-child form.kb-form-loading .kb-forms-submit { position: relative; color: transparent !important; pointer-events: none; opacity: .85; }
[data-kind="post"] #secondary .widget:last-child form.kb-form-loading .kb-forms-submit::after { content: ""; position: absolute; inset: 0; margin: auto; width: 18px; height: 18px; border: 2px solid rgba(255, 255, 255, .45); border-top-color: #fff; border-radius: 50%; animation: kbSpin .7s linear infinite; }
@keyframes kbSpin { to { transform: rotate(360deg); } }
[data-kind="post"] #secondary .widget:last-child .kb-form-loading .kb-form-loading-spin, [data-kind="post"] #secondary .widget:last-child .kb-forms-submit .kb-form-loading-spin { display: none !important; }
/* The theme's spacing around the button and the honeypot field */
[data-kind="post"] #secondary .widget:last-child .kb-submit-field { margin: 0 !important; }
[data-kind="post"] #secondary .widget:last-child .kb-form-field.kb-accept-field, [data-kind="post"] #secondary .widget:last-child input.verify { display: none !important; }
@media (max-width: 640px) { html body .lookHero .entry-meta { border-radius: 18px; row-gap: 8px !important; } .lookHero .entry-meta .updated-on { border-left: 0; padding-left: 4px; } }

