/*
 * News. — "Lifestyle" design style (lifestyle / fashion magazine), News. — Theme & Colors → Design style.
 * Loaded after the base styles. Preset: white header with a large centred logo and a centred
 * menu row, mauve accent, Fraunces headlines, Work Sans text, Newsreader article text.
 * Lots of white space, large pictures, centred captions, thin rules.
 * Front-page top section: template-parts/home/featured-lifestyle.php.
 */

.style-lifestyle{
  --life-accent: var(--red);
  --radius-s: 0px;
  --radius-m: 0px;
  --radius-l: 0px;
}
html:not([data-theme="dark"]) .style-lifestyle{ --paper:#FFFFFF; --paper-2:#FAF7F4; --line:#ECE6E0; --border-bottom:#ECE6E0; --ink:#1B1718; --muted:#6B6163; }
html[data-theme="dark"] .style-lifestyle{ --paper:#111012; --paper-2:#18161A; --life-accent:color-mix(in srgb, var(--red) 55%, #ffffff); }

/* ---- Type: elegant serif display ---- */
.style-lifestyle h1, .style-lifestyle h2, .style-lifestyle h3,
.style-lifestyle .featured__headline, .style-lifestyle .story-card__headline, .style-lifestyle .article-title,
.style-lifestyle .feature-title, .style-lifestyle .cover-card h3, .style-lifestyle .showbiz-card__title{
  font-family:var(--display); font-weight:500; letter-spacing:-.01em;
}
.style-lifestyle .article-title, .style-lifestyle .feature-title{ font-weight:400; line-height:1.08; }

/* ---- Header: big centred logo, centred menu in spaced small caps ---- */
.style-lifestyle .brand-bar__inner{ height:84px; }
.style-lifestyle .brand__logo{ height:var(--logo-h, 40px); }
.style-lifestyle .nav-bar{ background:var(--paper); border-top:1px solid var(--border-bottom); border-bottom:1px solid var(--border-bottom); }
.style-lifestyle .nav-bar__inner{ justify-content:center; }
.style-lifestyle .nav-bar__utility{ display:none; }
.style-lifestyle .nav-bar__links > .nav-link:first-child{ padding-left:16px; }
.style-lifestyle .nav-link{ padding-inline:16px; font-family:var(--sans); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.style-lifestyle .nav-link::after{ height:1px; left:16px; right:16px; background:currentColor; }
.style-lifestyle .nav-link.is-active, .style-lifestyle .nav-item.is-open .nav-link{ color:var(--ink); }
.style-lifestyle .brand-bar__premium{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.style-lifestyle .breaking{ background:var(--paper); border-bottom:1px solid var(--border-bottom); }
.style-lifestyle .breaking__track li{ color:var(--ink); font-weight:400; font-family:var(--display); font-size:15px; }
.style-lifestyle .live-tag{ border-radius:0; background:var(--ink); color:var(--paper); letter-spacing:.16em; }
.style-lifestyle .topic-row{ background:var(--paper); }
@media (max-width:860px){
  .style-lifestyle .brand-bar__inner{ height:60px; }
  .style-lifestyle .brand__logo{ height:var(--logo-h-m, 30px); }
}

/* ---- Section heads: centred serif title between thin lines ---- */
.style-lifestyle .section__dot{ display:none; }
.style-lifestyle .section__head{ border:0; justify-content:center; gap:18px; position:relative; }
.style-lifestyle .section__title,
.style-lifestyle .shead__title{ font-family:var(--display); font-size:30px; font-weight:400; font-style:italic; letter-spacing:0; }
.style-lifestyle .section__head::before,
.style-lifestyle .section__head::after{ content:""; flex:1; height:1px; background:var(--border-bottom); }
.style-lifestyle .see-all:not(.see-all--light){ position:absolute; right:0; top:50%; transform:translateY(-50%); padding-left:12px; background:var(--paper); font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.style-lifestyle .section{ padding-block:clamp(40px, 5vw, 76px); }

/* ---- Labels: spaced small caps, no boxes ---- */
.style-lifestyle .tag{ background:transparent !important; color:var(--life-accent) !important; padding:0; border-radius:0; font-weight:600; letter-spacing:.18em; font-size:10.5px; }
.style-lifestyle .story-card .tag, .style-lifestyle .featured__cover-body .tag{ color:#fff !important; }
.style-lifestyle .kicker{ letter-spacing:.18em; font-weight:600; color:var(--life-accent); }

/* ---- Buttons: square, black ---- */
.style-lifestyle .btn{ border-radius:0; letter-spacing:.14em; text-transform:uppercase; font-size:12px; font-weight:600; }
.style-lifestyle .btn--primary{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.style-lifestyle .btn--primary:hover{ background:var(--life-accent); border-color:var(--life-accent); }

/* ---- Article: airy reading column ---- */
.style-lifestyle .article-body p, .style-lifestyle .feature-content p{ font-size:19px; line-height:1.75; }

/* =====================================================================
   FRONT PAGE TOP (featured-lifestyle.php)
   ===================================================================== */
.lx-top{ padding-top:clamp(24px, 3vw, 44px); }
.lx-kicker{ display:block; font-family:var(--sans); font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--life-accent, var(--red)); }
.lx-byline{ display:block; font-family:var(--sans); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }

.lx-hero{ display:block; color:var(--ink); text-align:center; }
.lx-hero__media{ position:relative; display:block; aspect-ratio:21/9; overflow:hidden; background:var(--paper-2); }
.lx-hero__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
.lx-hero:hover .lx-hero__media img{ transform:scale(1.02); }
.lx-hero__media .live-badge{ position:absolute; top:16px; left:16px; z-index:2; }
.lx-hero__body{ display:flex; flex-direction:column; align-items:center; gap:14px; max-width:820px; margin:0 auto; padding:34px 16px 0; }
.lx-hero__title{ margin:0; font-family:var(--display); font-size:clamp(34px, 4.4vw, 62px); font-weight:400; line-height:1.06; letter-spacing:-.02em; }
.lx-hero:hover .lx-hero__title{ color:var(--life-accent, var(--red)); }
.lx-hero__dek{ margin:0; max-width:60ch; font-family:var(--display); font-size:19px; font-style:italic; line-height:1.5; color:var(--muted); }

.lx-trio{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:clamp(20px, 3vw, 44px); margin-top:clamp(48px, 6vw, 84px); }
.lx-card{ display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; color:var(--ink); min-width:0; }
.lx-card__media{ position:relative; display:block; width:100%; aspect-ratio:3/4; overflow:hidden; background:var(--paper-2); margin-bottom:6px; }
.lx-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.2,.7,.2,1); }
.lx-card:hover .lx-card__media img{ transform:scale(1.04); }
.lx-card__title{ margin:0; max-width:24ch; font-family:var(--display); font-size:22px; font-weight:400; line-height:1.2; }
.lx-card:hover .lx-card__title{ color:var(--life-accent, var(--red)); }

.lx-split{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(28px, 5vw, 80px); align-items:center; margin-top:clamp(56px, 7vw, 100px); color:var(--ink); }
.lx-split__media{ display:block; aspect-ratio:4/5; overflow:hidden; background:var(--paper-2); }
.lx-split__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
.lx-split:hover .lx-split__media img{ transform:scale(1.03); }
.lx-split__body{ display:flex; flex-direction:column; gap:18px; max-width:480px; }
.lx-split__title{ margin:0; font-family:var(--display); font-size:clamp(30px, 3.4vw, 48px); font-weight:400; line-height:1.1; letter-spacing:-.015em; }
.lx-split__dek{ margin:0; font-family:var(--display); font-size:18px; font-style:italic; line-height:1.55; color:var(--muted); }
.lx-split__more{ align-self:flex-start; padding-bottom:4px; border-bottom:1px solid currentColor; font-family:var(--sans); font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.lx-split:hover .lx-split__more{ color:var(--life-accent, var(--red)); }
.lx-top .ad-wrap{ margin-top:clamp(40px, 5vw, 72px); }

@media (max-width:860px){
  .lx-hero__media{ aspect-ratio:4/5; }
  .lx-hero__body{ padding-top:22px; }
  .lx-trio{ grid-template-columns:minmax(0,1fr); gap:40px; }
  .lx-card__media{ aspect-ratio:4/5; }
  .lx-split{ grid-template-columns:minmax(0,1fr); }
  .lx-split__body{ max-width:none; align-items:center; text-align:center; }
  .lx-split__more{ align-self:center; }
}
@media (prefers-reduced-motion: reduce){
  .lx-hero__media img, .lx-card__media img, .lx-split__media img{ transition:none; }
}