/* =========================================================
   TRENDLY — MASTER STYLESHEET
   Shared across all pages (home, blog listing, shop listing,
   article/product templates). Keep this file as the single
   source of truth for design tokens and shared components.
   ========================================================= */

:root{
  --ink:#111;
  --ink-2:#333;
  --muted:#7a7a7a;
  --line:#eaeaea;
  --cream:#f7f3ee;
  --paper:#fdfcfa;
  --accent:#c14a3f;
  --gold:#a9822f;
  --charcoal:#161513;
  --font-serif:'Lora', Georgia, serif;
  --font-sans:'Inter', -apple-system, Helvetica, Arial, sans-serif;
}

html,body{background:#fff;color:var(--ink);font-family:var(--font-sans);overflow-x:hidden;}
body{-webkit-font-smoothing:antialiased;letter-spacing:.005em;max-width:100vw;}
*{box-sizing:border-box;}

a{color:inherit;text-decoration:none;}
a:hover{color:var(--ink);}

img{max-width:100%;display:block;}
figure{margin:0;}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
}

/* ============ Top utility bar ============ */
.topbar{background:#111;color:#e8e8e8;font-size:11px;letter-spacing:.14em;padding:7px 0;text-transform:uppercase;}
.topbar-text{opacity:.85;font-size:11px;letter-spacing:.16em;}
.topbar-link{color:#e8e8e8;font-size:11px;letter-spacing:.18em;font-weight:500;transition:color .15s ease;}
.topbar-link:hover{color:#fff;text-decoration:underline;}
@media (max-width: 575.98px){
  .topbar{padding:6px 0;}
  .topbar-link{font-size:10px;letter-spacing:.14em;}
  .topbar-text{display:none;}
}

/* ============ Fixed header wrapper (topbar + header + category nav pin together) ============ */
.site-header-sticky{position:fixed;top:0;left:0;right:0;width:100%;z-index:1030;background:#fff;}
.site-subheader{border-bottom:1px solid var(--line);}
body{padding-top:var(--sticky-offset, 132px);}
@media (max-width:767.98px){ body{padding-top:var(--sticky-offset, 98px);} }

.social-follow-bar{border-top:1px solid var(--line);background:#fff;padding:5px 0;display:flex;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;}
.social-follow-bar::-webkit-scrollbar{display:none;}
.social-follow-bar .d-flex{flex-wrap:nowrap!important;width:100%;}
.social-follow-label{
  font-size:9px;letter-spacing:.22em;font-weight:700;color:var(--muted);
  text-transform:uppercase;margin-right:12px;white-space:nowrap;flex:0 0 auto;
}
.social-icon-row{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;flex:0 0 auto;}
.social-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:50%;
  border:1px solid var(--line);color:#555;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.social-icon svg{width:12px;height:12px;}
.social-icon:hover{transform:translateY(-2px);border-color:transparent;color:#fff;}
.social-icon.ig:hover{background:radial-gradient(circle at 30% 110%, #ffdb73 0%, #fd5949 45%, #d6249f 70%, #285AEB 100%);}
.social-icon.pin:hover{background:#e60023;}
.social-icon.fb:hover{background:#1877f2;}
.social-icon.tiktok:hover{background:#111;}
.social-icon.yt:hover{background:#ff0000;}
.social-follow-count{
  font-size:10px;color:var(--muted);letter-spacing:.04em;margin-left:auto;white-space:nowrap;
}
.header-social-inline{gap:10px;padding-left:16px;margin-left:auto;border-left:1px solid var(--line);}
.header-social-inline .social-follow-count{margin-left:12px;}
@media (max-width:991.98px){
  .header-social-inline .social-follow-count{display:none;}
  .header-social-inline .social-follow-label{display:none;}
}
@media (max-width: 767.98px){
  .social-follow-bar{padding:5px 0;}
  .social-follow-label{font-size:9px;letter-spacing:.16em;margin-right:8px;}
  .social-icon{width:22px;height:22px;}
  .social-icon svg{width:11px;height:11px;}
  .social-follow-count{display:none;}
}

/* ============ Compact sticky header (collapses on scroll to match
   the "logo + edition + search only" reference) ============ */
.site-header-sticky.is-compact .topbar{display:none;}
.site-header-sticky.is-compact .header-social-inline{display:none;}
.site-header-sticky.is-compact .category-nav{display:none;}
.site-header-sticky.is-compact .site-subheader{border-bottom:0;}
.site-header-sticky.is-compact .header-row{padding-top:.6rem;padding-bottom:.6rem;}
.site-header-sticky.is-compact .brand-logo{font-size:26px;letter-spacing:.2em;}
.site-header-sticky{transition:box-shadow .2s ease;box-shadow:0 1px 0 rgba(0,0,0,.04);}
.site-header-sticky.shadow-sm{box-shadow:0 6px 18px rgba(17,17,17,.08) !important;}
.site-header-sticky .header-row,
.site-header-sticky .brand-logo{transition:padding .2s ease, font-size .2s ease;}
@media (max-width:767.98px){
  .site-header-sticky.is-compact .brand-logo{font-size:17px;letter-spacing:.1em;}
}

.site-header{border-bottom:1px solid var(--line);background:#fff;}
.header-row{position:relative;}
.brand-logo{
  font-family:var(--font-serif);
  font-weight:700;
  font-size:34px;
  letter-spacing:.28em;
  color:var(--ink);
  text-transform:uppercase;
  line-height:1;
  display:inline-block;
}
.brand-logo.brand-sm{font-size:22px;}
.brand-logo.brand-footer{font-size:28px;color:#fff;}
@media (max-width: 767.98px){
  .brand-logo{font-size:19px;letter-spacing:.14em;}
}
.header-link{letter-spacing:.16em;text-transform:uppercase;font-weight:500;font-size:12px;color:#111;transition:opacity .15s ease;}
.header-link:hover{opacity:.55;}
.icon-btn{color:#111;transition:opacity .15s ease;}
.icon-btn:hover{opacity:.55;}
.nav-toggle{color:#111;}

/* ============ Edition / country dropdown ============ */
.edition-dropdown{position:relative;padding-left:16px;margin-left:2px;border-left:1px solid var(--line);}
@media (max-width:767.98px){
  .edition-dropdown{padding-left:10px;margin-left:0;}
}
.edition-toggle{
  background:none;border:0;padding:0;
  font-size:12px;letter-spacing:.16em;font-weight:600;
  color:#111;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:6px;
  white-space:nowrap;
}
.edition-toggle:hover{color:var(--accent);}
.edition-toggle::after{display:inline-block;margin-left:2px;vertical-align:.02em;content:"";border-top:4px solid;border-right:4px solid transparent;border-left:4px solid transparent;}
.edition-toggle .edition-flag{font-size:14px;line-height:1;}
@media (max-width:767.98px){
  .edition-toggle{font-size:10px;letter-spacing:.1em;gap:4px;}
  .edition-toggle .edition-label-full{display:none;}
}
.edition-menu{
  min-width:190px;border:1px solid var(--line);border-radius:0;
  padding:6px;box-shadow:0 14px 30px rgba(17,17,17,.10);
  position:relative;z-index:1060;
}
.edition-menu .dropdown-item{
  font-size:12px;letter-spacing:.06em;padding:9px 12px;
  display:flex;align-items:center;gap:10px;border-radius:0;
}
.edition-menu .dropdown-item .edition-flag{font-size:15px;}
.edition-menu .dropdown-item:hover,
.edition-menu .dropdown-item:focus{background:var(--cream);color:var(--accent);}
.edition-menu .dropdown-item.active{background:#111;color:#fff;}

/* NOTE: intentionally no overflow-x/overflow-y here. Setting overflow-x:auto
   with overflow-y:visible used to clip the "Fashion" (and other) dropdown
   menus, because browsers coerce a visible/non-visible overflow pairing so
   BOTH axes clip. This container is hidden on mobile anyway (the offcanvas
   menu is used there instead), and <body> already has overflow-x:hidden as a
   global safety net, so leaving overflow unset here is safe and lets dropdown
   menus render fully instead of being cut off behind page content. */
.category-nav{border-top:1px solid var(--line);position:relative;z-index:1040;}
.category-nav ul{flex-wrap:wrap;white-space:nowrap;width:max-content;min-width:100%;justify-content:center;}
@media (max-width: 767.98px){
  .category-nav{display:none;}
}
.cat-link{
  font-size:12px;
  letter-spacing:.2em;
  color:#111;
  text-transform:uppercase;
  font-weight:500;
  padding:6px 2px;
  position:relative;
  transition:color .15s ease;
  white-space:nowrap;
}
.cat-link:hover{color:var(--accent);}
.cat-link:hover::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--accent);}
.cat-link.active{color:var(--accent);}
.cat-link.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--accent);}
.cat-highlight{color:var(--accent);}
.cat-lux{color:var(--gold);}

/* ============ Offcanvas side menu ============ */
.side-offcanvas{background:var(--cream);width:min(420px,88vw);}
.side-offcanvas .offcanvas-header{
  border-bottom:1px solid var(--line);
  padding:22px 28px;
}
.side-close-btn{
  width:44px;height:44px;border-radius:50%;
  border:1px solid var(--line);
  background:transparent;
  display:inline-flex;align-items:center;justify-content:center;
  color:#111;transition:background .2s ease, border-color .2s ease, transform .2s ease;
  padding:0;
}
.side-close-btn:hover{border-color:#111;transform:rotate(90deg);}
.side-offcanvas .offcanvas-body{padding:28px;display:flex;flex-direction:column;}
.side-eyebrow{
  font-size:11px;letter-spacing:.3em;font-weight:700;color:var(--muted);
  text-transform:uppercase;margin-bottom:8px;display:block;
}
.side-menu{margin:0;padding:0;}
.side-menu li{border-top:1px solid var(--line);}
.side-menu li:last-child{border-bottom:1px solid var(--line);}
.side-menu li a{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:22px 2px;
  font-family:var(--font-serif);
  font-weight:500;
  font-size:32px;
  line-height:1.05;
  color:#111;
  transition:color .2s ease, padding-left .2s ease;
}
.side-menu li a:hover{color:var(--accent);padding-left:8px;}
.side-menu li a .side-num{
  font-family:var(--font-sans);
  font-size:13px;
  font-weight:500;
  color:var(--muted);
  letter-spacing:.05em;
  white-space:nowrap;
}
@media (max-width:575.98px){
  .side-menu li a{font-size:26px;padding:18px 2px;}
}
.side-follow{margin-top:auto;padding-top:28px;}
.side-follow-label{
  font-size:11px;letter-spacing:.3em;font-weight:700;color:var(--muted);
  text-transform:uppercase;margin-bottom:14px;display:block;
}
.side-social-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.side-social-row a{
  width:44px;height:44px;border-radius:50%;
  border:1px solid var(--line);
  display:inline-flex;align-items:center;justify-content:center;
  color:#111;background:#fff;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.side-social-row a:hover{transform:translateY(-2px);border-color:transparent;color:#fff;}
.side-social-row a.ig:hover{background:radial-gradient(circle at 30% 110%, #ffdb73 0%, #fd5949 45%, #d6249f 70%, #285AEB 100%);}
.side-social-row a.pin:hover{background:#e60023;}
.side-social-row a.fb:hover{background:#1877f2;}
.side-social-row a.tiktok:hover{background:#111;}
.side-social-row a.yt:hover{background:#ff0000;}
.side-social-row a.close-follow{margin-left:auto;background:#111;color:#fff;border-color:#111;}
.side-social-row a.close-follow:hover{background:#c14a3f;transform:none;}

/* ---------- Hero (home) ---------- */
.hero-section{background:#fff;}
.hero-article{display:block;}
.hero-img-wrap{position:relative;overflow:hidden;aspect-ratio: 4/3;background:#f2efeb;}
.hero-img{width:100%;height:100%;object-fit:cover;transform:scale(1);transition:transform .8s ease;}
.hero-article:hover .hero-img{transform:scale(1.03);}
.category-tag{
  position:absolute;top:16px;left:16px;
  background:#fff;color:#111;
  font-size:11px;letter-spacing:.22em;font-weight:600;
  padding:6px 12px;text-transform:uppercase;
}
.hero-title{
  font-family:var(--font-serif);
  font-weight:700;
  font-size:clamp(26px,3.4vw,48px);
  line-height:1.08;
  margin:8px 0 10px;
  color:#111;
}
.hero-dek{font-size:16px;color:var(--ink-2);max-width:640px;line-height:1.55;}
.byline{font-size:11px;letter-spacing:.22em;color:var(--muted);text-transform:uppercase;}

.side-card{display:block;}
.side-card img{aspect-ratio:5/4;object-fit:cover;background:#f2efeb;transition:transform .6s ease;}
.side-card:hover img{transform:scale(1.03);}
.side-body{padding:12px 0 0;}
.side-title{
  font-family:var(--font-serif);
  font-weight:700;
  font-size:20px;
  line-height:1.2;
  margin:6px 0;
  color:#111;
}
.category-tag-sm{
  display:inline-block;
  font-size:10px;letter-spacing:.22em;font-weight:600;
  color:var(--accent);text-transform:uppercase;
  margin-top:4px;
}

/* ============ Trending Now (large outline heading + editorial grid) ============ */
.trending-now-section{background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.trending-now-outline{
  font-family:var(--font-serif);
  font-weight:800;
  font-size:clamp(40px,9vw,110px);
  line-height:1;
  text-align:center;
  text-transform:uppercase;
  color:transparent;
  -webkit-text-stroke:1.5px #111;
  margin:0 0 8px;
  letter-spacing:.01em;
}
.trending-now-card{color:inherit;}
.trending-now-card:hover .trending-now-title{color:var(--accent);}
.trending-now-card .card-img-wrap{margin-bottom:14px;border-radius:2px;overflow:hidden;}
.trending-now-card .card-img-wrap img{aspect-ratio:4/5;object-fit:cover;width:100%;transition:transform .4s ease;}
.trending-now-card:hover .card-img-wrap img{transform:scale(1.04);}
.trending-now-title{
  font-family:var(--font-serif);font-weight:700;font-size:19px;line-height:1.28;
  color:#111;margin:.5em 0 .3em;transition:color .2s ease;
}
.trending-now-dek{font-size:13.5px;line-height:1.5;color:#5c6472;margin-bottom:.6em;}
@media (max-width:767.98px){
  .trending-now-outline{font-size:clamp(30px,13vw,52px);-webkit-text-stroke:1px #111;}
  .trending-now-title{font-size:16px;}
  .trending-now-dek{display:none;}
}

.section-title{
  font-family:var(--font-serif);
  font-weight:700;
  font-size:clamp(22px,2.4vw,32px);
  color:#111;
  margin:0;
}
.eyebrow{
  display:inline-block;
  font-size:11px;letter-spacing:.28em;color:var(--accent);text-transform:uppercase;font-weight:600;
  margin-bottom:6px;
}
.see-all{font-size:12px;letter-spacing:.22em;font-weight:600;color:#111;text-transform:uppercase;white-space:nowrap;}
.see-all:hover{color:var(--accent);}

.article-card{display:block;color:#111;}
.card-img-wrap{aspect-ratio:4/5;overflow:hidden;background:#f2efeb;}
.card-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.article-card:hover .card-img-wrap img{transform:scale(1.04);}
.card-title{
  font-family:var(--font-serif);
  font-weight:700;font-size:17px;line-height:1.25;
  margin:8px 0 6px;color:#111;
}
.card-title.lg{font-size:22px;line-height:1.2;}
.card-dek{font-size:14px;color:var(--ink-2);margin-bottom:6px;line-height:1.55;}
.article-card.lg .card-img-wrap{aspect-ratio:16/10;}

.editorial-section{border-top:1px solid var(--line);}
.lead-story .card-img-wrap{aspect-ratio:4/3;}
.lead-story .card-title{font-size:clamp(20px,2.4vw,28px);}
.lead-story .card-dek{font-size:15px;max-width:520px;}

.trends-band{background:linear-gradient(180deg,#fdfbf8 0%,#f7f2ea 100%);position:relative;}
.trends-band::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent) 0%,#e8b7ac 45%,transparent 100%);}
.trends-band .lead-story .card-img-wrap{border:1px solid var(--line);}

.headline-list{list-style:none;margin:0;padding:0;}
.headline-item{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-top:1px solid var(--line);}
.headline-list li:last-child{border-bottom:1px solid var(--line);}
.headline-thumb{width:84px;min-width:84px;aspect-ratio:1/1;overflow:hidden;background:#f2efeb;}
.headline-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.headline-item:hover .headline-thumb img{transform:scale(1.06);}
.headline-num{
  font-family:var(--font-serif);font-weight:700;font-style:italic;
  color:var(--accent);font-size:15px;min-width:22px;
}
.headline-text .headline-title{
  font-family:var(--font-serif);font-weight:700;font-size:16px;line-height:1.28;color:#111;margin:0 0 4px;
}
.headline-text .byline{letter-spacing:.16em;}

.luxury-section{background:linear-gradient(180deg, #fbf7ef 0%, #f6efdf 100%);color:var(--ink);border-top:1px solid #e8dcc2;border-bottom:1px solid #e8dcc2;}
.luxury-section .eyebrow{color:var(--gold);}
.luxury-section .section-title{color:#111;font-style:italic;}
.luxury-section .see-all{color:#111;}
.luxury-section .see-all:hover{color:var(--gold);}
.luxury-section .card-title,
.luxury-section .headline-title{color:#111;}
.luxury-section .card-dek{color:var(--ink-2);}
.luxury-section .byline{color:#9c8a5e;}
.luxury-section .headline-item{border-color:#e8dcc2;}
.luxury-section .headline-num{color:var(--gold);}
.luxury-section .category-tag-sm{color:var(--gold);}
.lux-rule{border:0;border-top:1px solid #e0d3b3;margin:0 0 32px;}
.lux-product-card{background:#fff;border:1px solid #e8dcc2;padding:16px;display:block;transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;}
.lux-product-card:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 14px 30px rgba(169,130,47,.14);}
.lux-product-card .product-img{background:#f6f2ec;}
.lux-product-card .product-brand{color:var(--gold);letter-spacing:.22em;}
.lux-product-card .product-name{color:#111;font-family:var(--font-serif);font-weight:600;font-size:15px;margin:4px 0 8px;}
.lux-product-card .product-price{color:#111;font-weight:600;}
.btn-shop-lux{background:transparent;border:1px solid var(--gold);color:var(--gold);font-size:11px;letter-spacing:.22em;font-weight:600;padding:11px 14px;transition:background .2s ease, color .2s ease;}
.lux-product-card:hover .btn-shop-lux{background:var(--gold);color:#fff;}

.editor-picks{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.product-card{
  display:block;color:#111;background:#fff;
  border:1px solid var(--line);
  padding:16px;transition:transform .25s ease, box-shadow .25s ease;
}
.product-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.06);}
.product-img{aspect-ratio:1/1;background:#f6f2ec;overflow:hidden;margin-bottom:12px;}
.product-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.product-card:hover .product-img img{transform:scale(1.05);}
.product-brand{font-size:10px;letter-spacing:.22em;font-weight:700;color:var(--muted);text-transform:uppercase;}
.product-name{font-family:var(--font-serif);font-weight:600;font-size:16px;margin:4px 0 8px;line-height:1.3;}
.product-price{font-size:14px;font-weight:600;color:#111;}
.price-old{color:var(--muted);text-decoration:line-through;margin-left:6px;font-weight:400;}
.btn-shop{
  background:#111;color:#fff;
  font-size:11px;letter-spacing:.22em;font-weight:600;
  border:0;border-radius:0;padding:12px 14px;
  transition:background .2s ease;
  width:100%;
}
.btn-shop:hover{background:var(--accent);color:#fff;}

.category-feature{background:var(--cream);}
.cat-feature-img{width:100%;aspect-ratio:4/5;object-fit:cover;background:#f2efeb;}
.feature-title{
  font-family:var(--font-serif);font-weight:700;
  font-size:clamp(24px,3vw,42px);line-height:1.1;margin:6px 0 14px;color:#111;
}
.feature-dek{font-size:16px;color:var(--ink-2);line-height:1.6;margin-bottom:18px;max-width:520px;}
.feature-list li{padding:10px 0;border-top:1px solid rgba(0,0,0,.08);font-size:15px;font-weight:500;}
.feature-list li:last-child{border-bottom:1px solid rgba(0,0,0,.08);}
.feature-list a{transition:color .2s ease;}
.feature-list a:hover{color:var(--accent);}

.bg-cream{background:var(--cream)!important;}

.world-news-section{background:#fff;border-top:1px solid var(--line);}
.world-card{display:block;color:#111;background:var(--paper);border:1px solid var(--line);padding:18px;height:100%;transition:transform .2s ease, box-shadow .2s ease;}
.world-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(0,0,0,.06);}
.world-tag{
  display:inline-flex;align-items:center;gap:6px;
  font-size:10px;letter-spacing:.2em;font-weight:700;color:#fff;
  background:#111;padding:5px 10px;text-transform:uppercase;margin-bottom:12px;
}
.world-tag .flag{font-size:13px;line-height:1;}
.world-title{font-family:var(--font-serif);font-weight:700;font-size:18px;line-height:1.3;margin:0 0 8px;}
.world-dek{font-size:13.5px;color:var(--ink-2);line-height:1.55;margin-bottom:10px;}
.world-meta{font-size:11px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;}

.newsletter-section{background:#fff;}
.newsletter-card{background:var(--cream);border:1px solid var(--line);}
.newsletter-title{
  font-family:var(--font-serif);font-weight:700;
  font-size:clamp(24px,3vw,40px);line-height:1.15;color:#111;margin:6px 0 8px;
}
.newsletter-sub{color:var(--ink-2);font-size:15px;margin-bottom:22px;}
.newsletter-form .form-control{border:1px solid #d9d3ca;background:#fff;}
.newsletter-form .form-control:focus{border-color:#111;box-shadow:none;}
.newsletter-note{font-size:11px;color:var(--muted);letter-spacing:.05em;}
.newsletter-note a{color:var(--ink);text-decoration:underline;}

.site-footer{background:#111;color:#d8d8d8;}
.footer-h{font-size:11px;letter-spacing:.24em;color:#fff;text-transform:uppercase;font-weight:700;margin-bottom:14px;}
.footer-links li a{display:inline-block;padding:5px 0;font-size:14px;color:#c9c9c9;transition:color .15s ease;}
.footer-links li a:hover{color:#fff;}
.footer-tag{color:#b7b7b7;font-size:14px;line-height:1.55;max-width:340px;}
.footer-follow-label{font-size:11px;letter-spacing:.24em;color:#8c8c8c;text-transform:uppercase;font-weight:700;margin-bottom:12px;}
.social-row a{color:#d8d8d8;transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #333;border-radius:50%;}
.social-row a:hover{color:#fff;border-color:transparent;transform:translateY(-2px);}
.social-row a.ig:hover{background:radial-gradient(circle at 30% 110%, #ffdb73 0%, #fd5949 45%, #d6249f 70%, #285AEB 100%);}
.social-row a.pin:hover{background:#e60023;}
.social-row a.fb:hover{background:#1877f2;}
.social-row a.tiktok:hover{background:#4a4a4a;}
.social-row a.yt:hover{background:#ff0000;}
.footer-bottom{border-color:#242424!important;}
.footer-bottom a:hover{color:#fff!important;}

#root{display:none;}
img[loading="lazy"]{background:#f2efeb;}

.carousel-hint{
  display:none;
  font-size:11px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;
  margin:-4px 0 12px;
}
.carousel-mobile{position:relative;}
.carousel-arrow{
  display:none;
  position:absolute;
  top:36%;
  right:4px;
  transform:translateY(-50%);
  width:36px;height:36px;border-radius:50%;
  align-items:center;justify-content:center;
  background:rgba(255,255,255,.95);
  border:1px solid var(--line);
  box-shadow:0 6px 16px rgba(17,17,17,.16);
  color:#111;
  z-index:5;
  padding:0;
}
.carousel-arrow:active{background:#fff;}
.luxury-section .carousel-arrow{border-color:#e0d3b3;}

@media (max-width: 767.98px){
  .carousel-hint{display:block;}
  .carousel-arrow{display:flex;}

  .carousel-mobile{
    margin-left:-.75rem;margin-right:-.75rem;padding-left:.75rem;padding-right:.75rem;
  }
  .carousel-mobile > .row{
    flex-wrap:nowrap;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    padding-bottom:10px;
    scroll-padding-left:.75rem;
  }
  .carousel-mobile > .row::-webkit-scrollbar{display:none;}
  .carousel-mobile > .row{scrollbar-width:none;}
  .carousel-mobile > .row > [class*="col-"]{
    flex:0 0 80%;
    max-width:80%;
    scroll-snap-align:start;
  }
  .carousel-mobile.carousel-tight > .row > [class*="col-"]{flex:0 0 62%;max-width:62%;}
  .carousel-mobile.carousel-wide > .row > [class*="col-"]{flex:0 0 92%;max-width:92%;}

  .headline-carousel{
    display:flex;flex-wrap:nowrap;gap:12px;
    margin:0 -.75rem;padding:2px .75rem 12px;
    overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    scroll-padding-left:.75rem;scrollbar-width:none;
  }
  .headline-carousel::-webkit-scrollbar{display:none;}
  .headline-carousel li.headline-item{
    flex:0 0 66%;max-width:66%;
    scroll-snap-align:start;
    flex-direction:column;align-items:stretch;gap:0;
    border:1px solid var(--line);
    padding:0;background:#fff;overflow:hidden;
  }
  .headline-carousel .headline-thumb{width:100%;min-width:100%;aspect-ratio:4/3;}
  .headline-carousel .headline-text{padding:12px 14px 14px;}
  .luxury-section .headline-carousel li.headline-item{border-color:#e0d3b3;background:#fff;}
}

@media (max-width: 767.98px){
  .hero-title{font-size:24px;}
  .card-title{font-size:15px;}
  .card-title.lg{font-size:18px;}
  .feature-title{font-size:24px;}
  .lead-story .card-title{font-size:20px;}
  .section-heading{align-items:flex-end;}
}

/* =========================================================
   NEW SHARED COMPONENTS — used on subpages (blog & shop listings)
   ========================================================= */

/* ---------- Page banner (used on interior/listing pages) ---------- */
.page-banner{
  background:var(--cream);
  border-bottom:1px solid var(--line);
  padding:40px 0 32px;
}
.page-banner .eyebrow{margin-bottom:10px;}
.page-banner-title{
  font-family:var(--font-serif);
  font-weight:700;
  font-size:clamp(30px,4.4vw,52px);
  line-height:1.08;
  margin:0 0 10px;
  color:#111;
}
.page-banner-dek{font-size:15.5px;color:var(--ink-2);max-width:640px;line-height:1.6;margin:0;}
.breadcrumb-trail{
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  margin-bottom:14px;
}
.breadcrumb-trail a{color:var(--muted);transition:color .15s ease;}
.breadcrumb-trail a:hover{color:var(--accent);}
.breadcrumb-trail .sep{margin:0 8px;opacity:.6;}
.breadcrumb-trail .current{color:var(--ink);}

/* ---------- Page banner, centered variant (magazine-style section landing) ---------- */
.page-banner.center{text-align:center;padding:56px 0 44px;}
.page-banner.center .eyebrow{margin-bottom:14px;}
.page-banner.center .page-banner-title{font-size:clamp(40px,7vw,84px);margin-bottom:0;}
.page-banner.center .breadcrumb-trail{justify-content:center;display:flex;}
.page-banner.center .page-banner-dek{margin:14px auto 0;text-align:center;}

/* ---------- Story list (magazine row layout: image left, text right) ---------- */
.story-list{list-style:none;margin:0;padding:0;}
.story-row{
  display:flex;gap:32px;align-items:flex-start;
  padding:34px 0;border-top:1px solid var(--line);
}
.story-list li.story-row:first-child{border-top:0;padding-top:4px;}
.story-row-img{
  flex:0 0 240px;width:240px;aspect-ratio:4/3;overflow:hidden;background:#f2efeb;
}
.story-row-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.story-row:hover .story-row-img img{transform:scale(1.04);}
.story-row-body{flex:1;min-width:0;padding-top:2px;}
.story-row-cat{
  display:inline-block;font-size:10.5px;letter-spacing:.2em;font-weight:700;
  color:var(--accent);text-transform:uppercase;margin-bottom:8px;
}
.story-row-title{
  font-family:var(--font-serif);font-weight:600;font-size:24px;line-height:1.28;
  color:#111;margin:0 0 12px;transition:color .15s ease;
}
.story-row:hover .story-row-title{color:var(--accent);}
.story-row-dek{font-size:14.5px;color:var(--ink-2);line-height:1.6;margin:0 0 10px;display:none;}
@media (min-width:576px){.story-row-dek{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}}

@media (max-width:575.98px){
  .story-row{flex-direction:column;gap:14px;padding:26px 0;}
  .story-row-img{width:100%;flex:0 0 auto;aspect-ratio:16/10;}
  .story-row-title{font-size:19px;}
  .page-banner.center{padding:40px 0 30px;}
}

/* ---------- Listing feed: single-column magazine feed (no sidebar) ---------- */
.feed-wrap{max-width:880px;margin:0 auto;}
.story-row-dek{display:-webkit-box !important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.story-row-lead{padding-top:4px !important;flex-direction:column;gap:22px;}
.story-row-lead .story-row-img{width:100%;flex:0 0 auto;aspect-ratio:16/9;}
.story-row-lead .story-row-title{font-size:clamp(26px,3.6vw,38px);max-width:100%;}
.story-row-lead .story-row-dek{-webkit-line-clamp:3;font-size:16px;max-width:640px;}
@media (max-width:767.98px){
  .story-row-lead .story-row-title{font-size:23px;}
}
.feed-footer-strip{border-top:1px solid var(--line);margin-top:56px;padding-top:44px;}
.feed-footer-strip h4{font-family:var(--font-serif);font-weight:700;font-size:16px;margin-bottom:16px;}
.feed-newsletter-mini{background:var(--cream);border:1px solid var(--line);padding:22px;}
.feed-newsletter-mini p{font-size:13px;color:var(--ink-2);margin-bottom:14px;}

/* ---------- Listing grid: 3-column card grid (image top, headline, dek, byline) ---------- */
.grid-card{display:block;}
.grid-card-img{aspect-ratio:3/4;overflow:hidden;background:#f2efeb;margin-bottom:18px;}
.grid-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.grid-card:hover .grid-card-img img{transform:scale(1.045);}
.grid-card-title{
  font-family:var(--font-serif);font-weight:600;font-size:22.5px;line-height:1.26;
  color:#111;margin:0 0 10px;transition:color .15s ease;
}
.grid-card:hover .grid-card-title{color:var(--accent);}
.grid-card-dek{font-size:14.5px;color:var(--ink-2);line-height:1.6;margin:0 0 10px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.listing-grid-row{row-gap:48px;}
@media (max-width:767.98px) and (min-width:576px){
  .listing-grid-row{row-gap:40px;}
}
/* True phones only — matches Bootstrap's col-sm-6 breakpoint so 2-up
   tablet widths keep the top-image card, and only single-column phones
   switch to the compact image-left/text-right row layout. */
@media (max-width:575.98px){
  .listing-grid-row{row-gap:0;}
  .listing-grid-row > .js-card{padding-bottom:26px;margin-bottom:26px;}
  .listing-grid-row > .js-card:last-child{margin-bottom:0;}
  .grid-card{display:flex;flex-direction:row;gap:16px;align-items:flex-start;}
  .grid-card-img{flex:0 0 132px;width:132px;aspect-ratio:3/4;margin-bottom:0;}
  /* Everything except the image (title + dek + byline) lives in one column
     so the byline sits under the title instead of becoming its own flex
     column and wrapping vertically. */
  .grid-card-body{flex:1;min-width:0;}
  .grid-card-title{font-size:17.5px;line-height:1.32;margin-bottom:8px;}
  .grid-card-dek{display:none;}
  .grid-card .byline{font-size:10.5px;}
}

/* ---------- Filter / sort bar (pill tabs + dropdown) ---------- */
.filter-bar{
  border-bottom:1px solid var(--line);
  background:#fff;
  position:sticky;
  top:var(--sticky-offset, 118px); /* kept in sync with the real header height by master.js */
  z-index:20;
}
.filter-scroll{
  display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  padding:14px 0;
}
.filter-scroll::-webkit-scrollbar{display:none;}
.filter-pill{
  flex:0 0 auto;
  white-space:nowrap;
  font-size:12px;letter-spacing:.1em;font-weight:600;text-transform:uppercase;
  color:var(--ink-2);
  background:#fff;
  border:1px solid var(--line);
  padding:8px 16px;
  border-radius:999px;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.filter-pill:hover{border-color:#111;color:#111;}
.filter-pill.active{background:#111;color:#fff;border-color:#111;}
.filter-pill.active:hover{color:#fff;}

.sort-select{
  font-size:12px;letter-spacing:.06em;font-weight:500;
  border:1px solid var(--line);border-radius:0;background:#fff;
  padding:9px 32px 9px 14px;color:#111;
  min-width:170px;
}
.sort-select:focus{outline:2px solid var(--accent);outline-offset:1px;box-shadow:none;border-color:var(--line);}

.results-count{font-size:12px;color:var(--muted);letter-spacing:.05em;white-space:nowrap;}

/* ---------- Listing grid meta / featured badge ---------- */
.badge-featured{
  position:absolute;top:16px;right:16px;
  background:var(--accent);color:#fff;
  font-size:10px;letter-spacing:.18em;font-weight:700;
  padding:5px 10px;text-transform:uppercase;
  z-index:2;
}
.card-img-wrap{position:relative;}

/* ---------- Pagination ---------- */
.pagination-row{
  display:flex;align-items:center;justify-content:center;gap:6px;
  margin-top:8px;
}
.page-btn{
  min-width:40px;height:40px;
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);
  font-size:13px;font-weight:600;color:#111;
  background:#fff;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
  padding:0 8px;
}
.page-btn:hover{border-color:#111;}
.page-btn.active{background:#111;color:#fff;border-color:#111;}
.page-btn[disabled],
.page-btn.disabled{opacity:.35;pointer-events:none;}
.page-btn.nav{font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:0 16px;width:auto;}
.page-ellipsis{color:var(--muted);padding:0 4px;font-size:13px;}

/* ---------- Sidebar (blog listing) ---------- */
.sidebar-block{border:1px solid var(--line);padding:22px;background:var(--paper);}
.sidebar-block + .sidebar-block{margin-top:24px;}
.sidebar-heading{
  font-family:var(--font-serif);font-weight:700;font-size:17px;margin:0 0 16px;
  padding-bottom:12px;border-bottom:1px solid var(--line);
}
/* ---------- Sidebar tags ---------- */
.sidebar-tags{display:flex;flex-wrap:wrap;gap:8px;}
.sidebar-tag{
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;
  border:1px solid var(--line);padding:7px 12px;color:var(--ink-2);
  transition:border-color .15s ease, color .15s ease;
}
.sidebar-tag:hover{border-color:#111;color:#111;}
.sidebar-mini-list{list-style:none;margin:0;padding:0;}
.sidebar-mini-item{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--line);}
.sidebar-mini-list li:first-child{border-top:0;}
.sidebar-mini-thumb{width:64px;min-width:64px;aspect-ratio:1/1;overflow:hidden;background:#f2efeb;}
.sidebar-mini-thumb img{width:100%;height:100%;object-fit:cover;}
.sidebar-mini-title{font-family:var(--font-serif);font-weight:700;font-size:13.5px;line-height:1.3;margin:0 0 4px;color:#111;}

/* ---------- Shop listing: filter sidebar (checkbox groups + price) ---------- */
.shop-filter-group{border-bottom:1px solid var(--line);padding:18px 0;}
.shop-filter-group:first-child{padding-top:0;}
.shop-filter-title{
  font-size:11px;letter-spacing:.2em;font-weight:700;text-transform:uppercase;color:#111;
  margin-bottom:14px;display:flex;align-items:center;justify-content:between;
}
.form-check-label{font-size:13.5px;color:var(--ink-2);}
.form-check-input{border-radius:0;border-color:#c9c2b7;}
.form-check-input:checked{background-color:#111;border-color:#111;}
.form-check-input:focus{box-shadow:none;border-color:#111;}
.price-range-inputs{display:flex;align-items:center;gap:8px;}
.price-range-inputs input{border:1px solid var(--line);border-radius:0;font-size:13px;padding:7px 10px;}
.btn-clear-filters{font-size:11px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;text-decoration:underline;background:none;border:0;padding:0;}
.btn-clear-filters:hover{color:var(--accent);}

/* ---------- Rating stars (shop) ---------- */
.stars{color:var(--gold);font-size:12px;letter-spacing:1px;}
.review-count{font-size:11px;color:var(--muted);margin-left:4px;}

/* ---------- Toast (wishlist / add to bag confirmations) ---------- */
.toast-mini{
  position:fixed;bottom:24px;left:50%;transform:translate(-50%,12px);
  background:#111;color:#fff;font-size:13px;letter-spacing:.03em;
  padding:14px 22px;z-index:2000;opacity:0;pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.toast-mini.show{opacity:1;transform:translate(-50%,0);pointer-events:auto;}

/* ---------- Empty state ---------- */
.empty-state{padding:70px 20px;text-align:center;}
.empty-state h3{font-family:var(--font-serif);font-weight:700;font-size:24px;margin-bottom:10px;}
.empty-state p{color:var(--muted);font-size:14px;margin-bottom:18px;}

/* ---------- Back to top ---------- */
.back-to-top{
  position:fixed;bottom:24px;right:24px;
  width:44px;height:44px;border-radius:50%;
  background:#111;color:#fff;
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
  z-index:1040;border:0;
}
.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0);}
.back-to-top:hover{background:var(--accent);}

@media (max-width:767.98px){
  .page-banner{padding:28px 0 24px;}
  .filter-bar{top:0;}
  .sidebar-block{padding:18px;}
}

/* =========================================================
   ARTICLE DETAIL PAGE
   ========================================================= */

.reading-progress{
  position:fixed;top:0;left:0;height:3px;background:var(--accent);
  width:0%;z-index:1050;transition:width .1s linear;
}

.article-header{padding:36px 0 0;background:#fff;}
.article-header-center{text-align:center;padding:34px 0 28px;}
.article-header-center .breadcrumb-trail.center{justify-content:center;display:flex;flex-wrap:wrap;gap:2px;margin-bottom:22px;}
.article-header-center .breadcrumb-trail .sep{font-size:8px;margin:0 10px;opacity:.55;position:relative;top:-1px;}
.article-category-tag{
  display:inline-block;font-size:11px;letter-spacing:.22em;font-weight:700;
  color:var(--accent);text-transform:uppercase;margin-bottom:14px;
}
.article-title{
  font-family:var(--font-serif);font-weight:700;
  font-size:clamp(26px,4vw,44px);line-height:1.14;
  margin:0 0 16px;color:#111;max-width:900px;
}
.article-title.center{margin:0 auto 22px;max-width:820px;}
.article-dek{font-size:17px;color:var(--ink-2);line-height:1.6;max-width:720px;margin:0 0 22px;}
.article-byline-center{
  font-size:14px;color:var(--ink-2);letter-spacing:.01em;margin:0 0 16px;
}
.article-byline-center .byline-author-link{color:#111;font-weight:700;letter-spacing:.04em;text-decoration:none;}
.article-byline-center .byline-author-link:hover{color:var(--accent);}
.article-byline-center .byline-cat-link{color:var(--ink-2);text-decoration:underline;text-underline-offset:3px;}
.article-byline-center .byline-cat-link:hover{color:var(--accent);}
.article-meta-row{
  display:flex;align-items:center;flex-wrap:wrap;gap:16px;
  padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  margin-bottom:28px;
}
.article-author{display:flex;align-items:center;gap:10px;}
.author-avatar{
  width:38px;height:38px;border-radius:50%;overflow:hidden;background:#f2efeb;flex:0 0 auto;
}
.author-avatar img{width:100%;height:100%;object-fit:cover;}
.author-name{font-size:13px;font-weight:600;color:#111;display:block;}
.author-role{font-size:11px;color:var(--muted);letter-spacing:.04em;}
.article-meta-sep{font-size:12px;color:var(--muted);}
.article-affiliate-note{
  font-size:12.5px;color:var(--muted);max-width:640px;margin:0 auto 22px;line-height:1.6;
}
.article-affiliate-note a{color:var(--muted);text-decoration:underline;text-underline-offset:2px;}
.article-affiliate-note a:hover{color:var(--accent);}
.article-share-row{display:flex;align-items:center;gap:8px;margin-left:auto;}
.article-share-row.center{justify-content:center;margin:0 auto;}
.share-btn{
  width:34px;height:34px;border-radius:50%;border:1px solid var(--line);
  display:inline-flex;align-items:center;justify-content:center;color:#111;background:#fff;
  transition:background .15s ease,color .15s ease,border-color .15s ease,transform .15s ease;
}
.share-btn:hover{transform:translateY(-2px);border-color:#111;}
.share-btn svg{width:15px;height:15px;}

/* Full-bleed hero photo — runs the entire browser width, edge to edge,
   independent of the centered text container above and below it. */
.article-hero-full{width:100%;aspect-ratio:21/10;overflow:hidden;background:#111;}
.article-hero-full img{width:100%;height:100%;object-fit:cover;display:block;}
@media (max-width:767.98px){
  .article-hero-full{aspect-ratio:4/5;}
}

.article-hero-caption{font-size:12px;color:var(--muted);margin:14px 0 36px;padding:0 1px;}

.article-body{font-size:17px;line-height:1.85;color:var(--ink-2);max-width:760px;}
.article-body p{margin-bottom:26px;}
.article-body h2{
  font-family:var(--font-serif);font-weight:700;font-size:28px;color:#111;
  margin:44px 0 18px;line-height:1.25;
}
.article-body h3{
  font-family:var(--font-serif);font-weight:700;font-size:21px;color:#111;
  margin:32px 0 14px;
}
.article-body img{width:100%;aspect-ratio:3/2;object-fit:cover;margin:8px 0 6px;background:#f2efeb;}
.article-body figcaption{font-size:12px;color:var(--muted);margin-bottom:28px;}
.article-body blockquote{
  font-family:var(--font-serif);font-style:italic;font-weight:600;
  font-size:24px;line-height:1.45;color:#111;
  border-left:3px solid var(--accent);padding-left:24px;margin:36px 0;
}
.article-body ul,.article-body ol{margin:0 0 26px;padding-left:22px;}
.article-body li{margin-bottom:10px;}
.article-body a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;}
.article-body strong{color:#111;}
.drop-cap::first-letter{
  font-family:var(--font-serif);font-weight:700;font-size:64px;line-height:.8;
  float:left;padding:8px 10px 0 0;color:var(--accent);
}

/* ---------- Shoppable listicle blocks (article body, "shop the story" format) ---------- */
.article-content-col{max-width:900px;}

/* ---------- Shop grid (WhoWhatWear-style product cards under each look) ---------- */
.shop-grid{margin:28px 0 40px;}
.shop-card{display:block;}
.shop-card-img{aspect-ratio:4/5;overflow:hidden;background:#f2efeb;margin-bottom:12px;}
.shop-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.shop-card:hover .shop-card-img img{transform:scale(1.05);}
.shop-card-brand{font-size:10.5px;letter-spacing:.2em;font-weight:700;color:var(--muted);text-transform:uppercase;}
.shop-card-name{font-family:var(--font-serif);font-weight:700;font-size:15.5px;margin:5px 0 6px;color:#111;line-height:1.3;}
.shop-card-price{font-size:14px;font-weight:600;color:#111;margin-bottom:8px;}
.shop-card-note{font-size:12.5px;color:var(--ink-2);line-height:1.5;font-style:italic;margin-bottom:12px;min-height:0;}
.shop-card .btn-shop-inline{width:100%;text-align:center;padding:10px 14px;font-size:10.5px;}
@media (max-width:575.98px){
  .shop-card-name{font-size:14px;}
  .shop-card-note{display:none;}
}

.shop-list{list-style:none;margin:40px 0;padding:0;counter-reset:shop-item;}
.shop-item{
  counter-increment:shop-item;
  display:flex;gap:26px;align-items:flex-start;
  padding:32px 0;border-top:1px solid var(--line);
  position:relative;
}
.shop-list li.shop-item:first-child{border-top:1px solid var(--line);}
.shop-item-num{
  font-family:var(--font-serif);font-weight:700;font-size:15px;color:var(--muted);
  min-width:28px;padding-top:4px;
}
.shop-item-num::before{content:counter(shop-item, decimal-leading-zero);}
.shop-item-img{
  flex:0 0 160px;width:160px;aspect-ratio:4/5;overflow:hidden;background:#f2efeb;
}
.shop-item-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.shop-item:hover .shop-item-img img{transform:scale(1.05);}
.shop-item-info{flex:1;min-width:0;padding-top:2px;}
.shop-item-brand{font-size:11px;letter-spacing:.2em;font-weight:700;color:var(--muted);text-transform:uppercase;}
.shop-item-name{font-family:var(--font-serif);font-weight:700;font-size:19px;margin:4px 0 8px;color:#111;line-height:1.3;}
.shop-item-price{font-size:15px;font-weight:600;color:#111;margin-bottom:12px;}
.shop-item-price .was{color:var(--muted);text-decoration:line-through;font-weight:400;margin-right:6px;}
.shop-item-note{font-size:14.5px;color:var(--ink-2);line-height:1.6;margin-bottom:14px;font-style:italic;}
.btn-shop-inline{
  display:inline-block;background:#111;color:#fff;
  font-size:11px;letter-spacing:.18em;font-weight:600;text-transform:uppercase;
  padding:11px 20px;border:1px solid #111;transition:background .2s ease,color .2s ease;
}
.btn-shop-inline:hover{background:#fff;color:#111;}
@media (max-width:767.98px){
  .shop-item{flex-direction:column;gap:16px;padding:28px 0;}
  .shop-item-img{width:100%;flex-basis:auto;aspect-ratio:4/5;max-width:360px;}
  .shop-item-num{display:none;}
  .shop-item-name{font-size:18px;}
}

.article-tags{display:flex;flex-wrap:wrap;gap:8px;margin:36px 0 0;padding-top:28px;border-top:1px solid var(--line);}

.author-box{
  display:flex;gap:18px;align-items:flex-start;
  background:var(--cream);border:1px solid var(--line);
  padding:24px;margin-top:40px;
}
.author-box .author-avatar{width:64px;height:64px;}
.author-box-name{font-family:var(--font-serif);font-weight:700;font-size:17px;margin:0 0 4px;color:#111;}
.author-box-role{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:10px;display:block;}
.author-box-bio{font-size:14px;color:var(--ink-2);line-height:1.6;margin:0;}

.related-heading{
  font-family:var(--font-serif);font-weight:700;font-size:24px;margin:0 0 20px;
  padding-top:36px;border-top:1px solid var(--line);
}

.comments-block{border-top:1px solid var(--line);padding-top:32px;margin-top:16px;}
.comment-form textarea{border:1px solid var(--line);border-radius:0;resize:vertical;min-height:100px;}
.comment-form input{border:1px solid var(--line);border-radius:0;}
.comment-form textarea:focus,.comment-form input:focus{border-color:#111;box-shadow:none;}

@media (max-width:767.98px){
  .article-header{padding:24px 0 0;}
  .article-header-center{padding:22px 0 20px;}
  .article-header-center .breadcrumb-trail.center{font-size:10px;}
  .article-header-center .breadcrumb-trail .sep{margin:0 6px;}
  .article-title{font-size:clamp(26px,7.4vw,38px);}
  .article-title.center{max-width:100%;}
  .article-dek{font-size:15.5px;}
  .article-byline-center{font-size:12.5px;}
  .article-affiliate-note{font-size:11.5px;padding:0 6px;}
  .article-meta-row{gap:10px 12px;padding:16px 0;}
  .article-share-row:not(.center){
    margin-left:0;width:100%;justify-content:flex-start;
    padding-top:14px;margin-top:2px;border-top:1px solid var(--line);
  }
  .article-body{font-size:16px;}
  .article-body h2{font-size:23px;margin:36px 0 14px;}
  .article-body h3{font-size:19px;margin:28px 0 12px;}
  .article-body blockquote{font-size:19px;padding-left:18px;margin:28px 0;}
  .drop-cap::first-letter{font-size:50px;padding:6px 8px 0 0;}
  .author-box{flex-direction:column;}
}