/*
Theme Name:   StyleSeenDaily Child
Theme URI:    https://styleseendaily.com
Description:  Kadence child theme for StyleSeenDaily — editorial lifestyle magazine
Author:       StyleSeenDaily
Template:     kadence
Version:      3.0.0
*/

/* ============================================
   GOOGLE FONTS
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@300;400;500&display=swap');

/* ============================================
   DESIGN TOKENS
   ============================================ */
:root {
  --ssd-accent:       #C4848A;
  --ssd-accent-lt:    #F2E4E5;
  --ssd-accent-dk:    #9E5F65;
  --ssd-accent-muted: #E8C8CB;
  --ssd-black:        #1A1A18;
  --ssd-gray-900:     #2C2C2A;
  --ssd-gray-700:     #5F5E5A;
  --ssd-gray-500:     #888780;
  --ssd-gray-300:     #D3D1C7;
  --ssd-gray-100:     #F1EFE8;
  --ssd-white:        #FDFCFA;
  --ssd-serif:        'Playfair Display', Georgia, serif;
  --ssd-sans:         'DM Sans', system-ui, sans-serif;
  --ssd-border:       1px solid #E8E6DE;
  --ssd-radius:       4px;
  --ssd-radius-lg:    10px;
  --ssd-trans:        0.22s ease;
}

/* ============================================
   KADENCE FULL-WIDTH OVERRIDE — HOME ONLY
   ============================================ */
body.ssd-home                                { background: var(--ssd-white) !important; }
body.ssd-home .site-container,
body.ssd-home .content-area,
body.ssd-home #primary,
body.ssd-home .site-main,
body.ssd-home .entry-content,
body.ssd-home .wp-site-blocks                { max-width: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important; float: none !important; }
body.ssd-home #secondary                     { display: none !important; }
body.ssd-home .entry-header,
body.ssd-home .entry-title,
body.ssd-home .page-title                    { display: none !important; }
body.ssd-home .kadence-inner-column-inner,
body.ssd-home .kb-row-layout-inner           { max-width: 100% !important; }

/* ============================================
   GLOBAL BASE
   ============================================ */
*, *::before, *::after { box-sizing: border-box; }

html { font-size: 16px; scroll-behavior: smooth; }

body {
  font-family: var(--ssd-sans);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.75;
  color: var(--ssd-gray-700);
  background: var(--ssd-white);
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; }
a   { color: inherit; text-decoration: none; transition: color var(--ssd-trans); }
a:hover { color: var(--ssd-accent); }

h1,h2,h3,h4,h5,h6 {
  font-family: var(--ssd-serif);
  font-weight: 500;
  line-height: 1.2;
  color: var(--ssd-black);
  letter-spacing: -0.01em;
}
h1 { font-size: 3rem; }
h2 { font-size: 2.25rem; }
h3 { font-size: 1.875rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1.125rem; }

/* ============================================
   NAV
   ============================================ */
.site-header, #masthead {
  border-bottom: var(--ssd-border);
  background: var(--ssd-white);
  position: sticky;
  top: 0;
  z-index: 100;
}

.site-branding .site-title a {
  font-family: var(--ssd-serif);
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--ssd-black);
  text-decoration: none;
}

.main-navigation a {
  font-family: var(--ssd-sans);
  font-size: 0.875rem;
  color: var(--ssd-gray-700);
  letter-spacing: 0.02em;
}
.main-navigation a:hover { color: var(--ssd-accent); }

/* ============================================
   EYEBROW
   ============================================ */
.ssd-eye {
  font-family: var(--ssd-sans);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--ssd-gray-500);
  display: block;
  margin-bottom: 0.5rem;
}
.ssd-eye--rose { color: var(--ssd-accent); }

/* ============================================
   INNER CONTAINER
   ============================================ */
.ssd-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 2rem;
}
@media (max-width: 640px) { .ssd-inner { padding: 0 1.1rem; } }

/* ============================================
   SECTION LABEL
   ============================================ */
.ssd-sec-label {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 2rem;
}
.ssd-sec-label__text {
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--ssd-gray-500);
  white-space: nowrap;
}
.ssd-sec-label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--ssd-gray-300);
}

/* ============================================
   HOMEPAGE MAIN WRAPPER
   ============================================ */
.ssd-home {
  width: 100%;
  overflow-x: hidden;
  background: var(--ssd-white);
}

/* ============================================
   HERO
   ============================================ */
.ssd-hero {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 4rem;
  align-items: end;
  max-width: 1200px;
  margin: 0 auto;
  padding: 5rem 2rem 4rem;
  border-bottom: var(--ssd-border);
}
@media (max-width: 960px) {
  .ssd-hero { grid-template-columns: 1fr; gap: 2.5rem; padding: 3rem 1.25rem 2.5rem; }
}

.ssd-hero__title {
  font-family: var(--ssd-serif);
  font-size: clamp(2.4rem, 4.5vw, 3.75rem);
  font-weight: 400;
  line-height: 1.1;
  color: var(--ssd-black);
  letter-spacing: -0.02em;
  margin: 0 0 1.25rem;
}
.ssd-hero__title em { font-style: italic; color: var(--ssd-gray-500); }

.ssd-hero__sub {
  font-size: 1rem;
  font-weight: 300;
  color: var(--ssd-gray-500);
  line-height: 1.85;
  max-width: 440px;
  margin: 0 0 2rem;
}

/* Pill filters */
.ssd-pills { display: flex; gap: 0.4rem; flex-wrap: wrap; }

.ssd-pill {
  font-family: var(--ssd-sans);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  padding: 6px 15px;
  border-radius: 999px;
  border: 1px solid var(--ssd-gray-300);
  color: var(--ssd-gray-700);
  background: transparent;
  cursor: pointer;
  transition: all var(--ssd-trans);
}
.ssd-pill:hover,
.ssd-pill.is-active {
  background: var(--ssd-black);
  border-color: var(--ssd-black);
  color: var(--ssd-white);
}

/* Editor's pick card */
.ssd-hero__pick {
  display: block;
  border: var(--ssd-border);
  border-radius: var(--ssd-radius-lg);
  overflow: hidden;
  background: var(--ssd-white);
  text-decoration: none;
  transition: box-shadow var(--ssd-trans);
}
.ssd-hero__pick:hover { box-shadow: 0 8px 30px rgba(26,26,24,0.09); }

.ssd-hero__pick-img {
  width: 100%;
  aspect-ratio: 3/2;
  overflow: hidden;
  background: linear-gradient(135deg, var(--ssd-accent-lt) 0%, #EAD8D9 100%);
}
.ssd-hero__pick-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.ssd-hero__pick:hover .ssd-hero__pick-img img { transform: scale(1.04); }

.ssd-hero__pick-img--ph {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ssd-hero__pick-img--ph span {
  font-family: var(--ssd-serif);
  font-size: 3rem;
  color: rgba(196,132,138,0.35);
}

.ssd-hero__pick-body {
  padding: 1.25rem 1.4rem 1.5rem;
}
.ssd-hero__pick-title {
  font-family: var(--ssd-serif);
  font-size: 1rem;
  font-weight: 500;
  color: var(--ssd-black);
  line-height: 1.35;
  margin: 0.3rem 0 0.75rem;
}
.ssd-hero__pick-link {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--ssd-accent);
  letter-spacing: 0.03em;
}

/* ============================================
   FEATURED SECTION
   ============================================ */
.ssd-feat-section {
  padding: 3.5rem 0;
  border-bottom: var(--ssd-border);
}

.ssd-feat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: var(--ssd-border);
  border-radius: var(--ssd-radius-lg);
  overflow: hidden;
}
@media (max-width: 768px) { .ssd-feat-grid { grid-template-columns: 1fr; } }

.ssd-feat-main {
  display: block;
  text-decoration: none;
  padding: 2rem;
  border-right: var(--ssd-border);
  transition: background var(--ssd-trans);
}
.ssd-feat-main:hover { background: var(--ssd-gray-100); color: inherit; }
@media (max-width: 768px) { .ssd-feat-main { border-right: none; border-bottom: var(--ssd-border); } }

.ssd-feat-main__img {
  width: calc(100% + 4rem);
  margin: -2rem -2rem 1.5rem -2rem;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: linear-gradient(135deg, var(--ssd-accent-lt), #E2CECC);
  min-height: 180px;
}
.ssd-feat-main__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.ssd-feat-main:hover .ssd-feat-main__img img { transform: scale(1.03); }

.ssd-feat-main__title {
  font-family: var(--ssd-serif);
  font-size: clamp(1.3rem, 2.2vw, 1.75rem);
  font-weight: 500;
  color: var(--ssd-black);
  line-height: 1.25;
  margin: 0.5rem 0 0.9rem;
  transition: color var(--ssd-trans);
}
.ssd-feat-main:hover .ssd-feat-main__title { color: var(--ssd-accent-dk); }

.ssd-feat-main__excerpt {
  font-size: 0.875rem;
  line-height: 1.75;
  color: var(--ssd-gray-500);
  margin-bottom: 1.25rem;
}
.ssd-feat-main__read {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--ssd-accent);
  letter-spacing: 0.03em;
}
.ssd-feat-main__read::after { content: ' →'; }

.ssd-feat-side { display: flex; flex-direction: column; }

.ssd-feat-side-item {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  flex: 1;
  padding: 1.25rem 1.5rem;
  border-bottom: var(--ssd-border);
  text-decoration: none;
  transition: background var(--ssd-trans);
}
.ssd-feat-side-item:last-child { border-bottom: none; }
.ssd-feat-side-item:hover { background: var(--ssd-gray-100); }

.ssd-feat-side-item__title {
  font-family: var(--ssd-serif);
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--ssd-black);
  line-height: 1.35;
  transition: color var(--ssd-trans);
}
.ssd-feat-side-item:hover .ssd-feat-side-item__title { color: var(--ssd-accent-dk); }
.ssd-feat-side-item__meta { font-size: 0.72rem; color: var(--ssd-gray-500); }

/* ============================================
   LATEST GUIDES
   ============================================ */
.ssd-latest-section {
  padding: 3.5rem 0;
  border-bottom: var(--ssd-border);
}

.ssd-card-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 2.5rem 2rem;
}
@media (max-width: 900px) { .ssd-card-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px) { .ssd-card-grid { grid-template-columns: 1fr; } }

.ssd-card {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  text-decoration: none;
}

.ssd-card__img {
  width: 100%;
  aspect-ratio: 16/10;
  border-radius: var(--ssd-radius);
  overflow: hidden;
  background: var(--ssd-gray-100);
}
.ssd-card__img--style    { background: linear-gradient(135deg,#F2E4E5,#EAD8D9); }
.ssd-card__img--travel   { background: linear-gradient(135deg,#DDE8E4,#C8DDD7); }
.ssd-card__img--wellness { background: linear-gradient(135deg,#DEE4D8,#CFDAC6); }
.ssd-card__img--beauty   { background: linear-gradient(135deg,#F2E4E5,#EDD4D6); }
.ssd-card__img--gadgets  { background: linear-gradient(135deg,#D8DDE4,#C8CDD9); }
.ssd-card__img--culture  { background: linear-gradient(135deg,#E4DED8,#D9D0C6); }

.ssd-card__img img { width:100%; height:100%; object-fit:cover; transition:transform 0.4s ease; }
.ssd-card:hover .ssd-card__img img { transform: scale(1.04); }

.ssd-card__tag { font-size:0.7rem; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; color:var(--ssd-accent); }

.ssd-card__title {
  font-family: var(--ssd-serif);
  font-size: 1rem;
  font-weight: 500;
  color: var(--ssd-black);
  line-height: 1.35;
  transition: color var(--ssd-trans);
}
.ssd-card:hover .ssd-card__title { color: var(--ssd-accent-dk); }
.ssd-card__meta { font-size:0.72rem; color:var(--ssd-gray-500); margin-top:auto; }

/* ============================================
   PILLAR SHOWCASE
   ============================================ */
.ssd-pillars-section {
  padding: 3.5rem 0;
  border-bottom: var(--ssd-border);
}

.ssd-pillar-row {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 2.5rem;
  padding: 2rem 0;
  border-bottom: 1px solid #ECEAE2;
  align-items: start;
}
.ssd-pillar-row:last-child { border-bottom: none; }
@media (max-width: 640px) { .ssd-pillar-row { grid-template-columns: 1fr; gap: 1rem; } }

.ssd-pillar-label { display:flex; flex-direction:column; gap:0.4rem; }
.ssd-pillar-label__name { font-family:var(--ssd-serif); font-size:1.6rem; font-weight:500; color:var(--ssd-black); }
.ssd-pillar-label__link { font-size:0.72rem; font-weight:500; color:var(--ssd-accent); letter-spacing:0.03em; }
.ssd-pillar-label__link::after { content:' →'; }

.ssd-pillar-articles { display:flex; flex-direction:column; }

.ssd-pillar-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem 0;
  border-bottom: 1px solid #ECEAE2;
  text-decoration: none;
  transition: padding-left var(--ssd-trans);
}
.ssd-pillar-item:last-child { border-bottom: none; }
.ssd-pillar-item:hover { padding-left: 0.4rem; }

.ssd-pillar-item__title { font-family:var(--ssd-serif); font-size:0.95rem; font-weight:500; color:var(--ssd-black); line-height:1.35; transition:color var(--ssd-trans); }
.ssd-pillar-item:hover .ssd-pillar-item__title { color:var(--ssd-accent-dk); }
.ssd-pillar-item__meta { font-size:0.7rem; color:var(--ssd-gray-500); white-space:nowrap; flex-shrink:0; }

/* ============================================
   NEWSLETTER
   ============================================ */
.ssd-nl {
  background: var(--ssd-gray-100);
  border-top: var(--ssd-border);
  padding: 4.5rem 2rem;
}
.ssd-nl__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
@media (max-width: 768px) { .ssd-nl__inner { grid-template-columns: 1fr; gap: 2rem; } }

.ssd-nl__title {
  font-family: var(--ssd-serif);
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  font-weight: 400;
  color: var(--ssd-black);
  line-height: 1.2;
  margin: 0 0 0.6rem;
}
.ssd-nl__title em { font-style:italic; color:var(--ssd-accent); }
.ssd-nl__sub { font-size:0.9rem; color:var(--ssd-gray-500); line-height:1.75; margin:0 0 1.5rem; }

.ssd-nl__promise { display:flex; flex-direction:column; gap:0.6rem; list-style:none; padding:0; margin:0; }
.ssd-nl__promise-item { display:flex; align-items:center; gap:0.75rem; font-size:0.85rem; color:var(--ssd-gray-700); }
.ssd-nl__promise-dot { width:5px; height:5px; border-radius:50%; background:var(--ssd-accent); flex-shrink:0; }

.ssd-nl__form { display:flex; flex-direction:column; gap:0.75rem; }
.ssd-nl__row  { display:flex; gap:0.6rem; }

.ssd-nl__input {
  font-family: var(--ssd-sans);
  font-size: 0.9rem;
  padding: 12px 16px;
  border: var(--ssd-border);
  border-radius: var(--ssd-radius);
  background: var(--ssd-white);
  color: var(--ssd-black);
  flex: 1;
  min-width: 0;
  outline: none;
  transition: border-color var(--ssd-trans);
}
.ssd-nl__input:focus { border-color: var(--ssd-accent); }
.ssd-nl__input::placeholder { color: var(--ssd-gray-300); }

.ssd-nl__btn {
  font-family: var(--ssd-sans);
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  padding: 12px 20px;
  background: var(--ssd-black);
  color: var(--ssd-white);
  border: none;
  border-radius: var(--ssd-radius);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--ssd-trans);
}
.ssd-nl__btn:hover { background: var(--ssd-gray-900); }
.ssd-nl__note { font-size:0.72rem; color:var(--ssd-gray-500); margin:0; }

/* ============================================
   SINGLE POST
   ============================================ */
.single .entry-content,
.page:not(.ssd-home) .entry-content {
  max-width: 720px;
  margin: 0 auto;
  padding: 2rem 2rem 4rem;
}
.single .entry-content p,
.single .entry-content li {
  font-size: 1.0625rem;
  line-height: 1.85;
  color: var(--ssd-gray-700);
}
.single .entry-content h2 { font-size: 1.875rem; margin: 2.5rem 0 1rem; }
.single .entry-content h3 { font-size: 1.5rem; margin: 2rem 0 0.75rem; }
.single .entry-content a { color: var(--ssd-accent-dk); text-decoration: underline; }
.single .entry-content blockquote {
  font-family: var(--ssd-serif);
  font-size: 1.25rem;
  font-style: italic;
  border-left: 2px solid var(--ssd-accent);
  padding: 1rem 2rem;
  margin: 2rem 0;
  color: var(--ssd-black);
}

/* ============================================
   BUTTONS
   ============================================ */
.ssd-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--ssd-sans);
  font-size: 0.875rem;
  font-weight: 500;
  padding: 11px 22px;
  border-radius: var(--ssd-radius);
  border: 1px solid transparent;
  cursor: pointer;
  transition: all var(--ssd-trans);
  text-decoration: none;
}
.ssd-btn--primary { background:var(--ssd-black); color:var(--ssd-white); border-color:var(--ssd-black); }
.ssd-btn--primary:hover { background:var(--ssd-gray-900); color:var(--ssd-white); }
.ssd-btn--accent  { background:var(--ssd-accent); color:var(--ssd-white); border-color:var(--ssd-accent); }
.ssd-btn--accent:hover  { background:var(--ssd-accent-dk); color:var(--ssd-white); }

/* ============================================
   AFFILIATE DISCLOSURE SHORTCODE
   ============================================ */
.ssd-disclosure {
  font-size: 0.8rem;
  color: var(--ssd-gray-500);
  background: var(--ssd-gray-100);
  border-radius: var(--ssd-radius);
  padding: 0.9rem 1.25rem;
  margin-bottom: 2rem;
  line-height: 1.6;
}

/* ============================================
   PRODUCT BOX SHORTCODE
   ============================================ */
.ssd-product-box {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
  border: var(--ssd-border);
  border-radius: var(--ssd-radius-lg);
  padding: 1.5rem;
  margin: 2rem 0;
}
.ssd-product-box__image { width: 110px; flex-shrink: 0; border-radius: var(--ssd-radius); overflow: hidden; }
.ssd-product-box__title { font-family:var(--ssd-serif); font-size:1.1rem; margin-bottom:0.4rem; }
.ssd-product-box__desc  { font-size:0.875rem; color:var(--ssd-gray-700); margin-bottom:1rem; }
@media (max-width: 560px) { .ssd-product-box { flex-direction:column; } .ssd-product-box__image { width:100%; } }

/* ============================================
   READING PROGRESS BAR
   ============================================ */
.ssd-progress-bar {
  position: fixed;
  top: 0; left: 0;
  width: 0%;
  height: 2px;
  background: var(--ssd-accent);
  z-index: 9999;
  transition: width 0.1s linear;
}

/* ============================================
   FOOTER
   ============================================ */
.site-footer, #colophon {
  border-top: var(--ssd-border);
  background: var(--ssd-white);
  padding: 2rem;
  text-align: center;
  font-size: 0.8rem;
  color: var(--ssd-gray-500);
}
.site-footer a { color: var(--ssd-accent); }