/*
 Theme Name: Spinelli Child
 Template: twentytwentyfour
 Version: 1.2.1
 Description: Refined design for juliospinelli.com — elegant, minimal, scroll-animated scientific portfolio.
 Author: "Scotty"
*/

/* === ROOT COLORS === */
:root {
  --ink: #0b0f19;
  --accent: #0a4fff;
  --accent2: #0bbfbf;
  --muted: #5b657a;
  --bg: #f7faff;
}

/* === BASE TYPOGRAPHY === */
body {
  background: var(--bg);
  color: var(--ink);
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  line-height: 1.6;
  margin: 0;
}

main {
  max-width: 980px;
  margin: 0 auto;
  padding: 1.5rem 1rem 4rem;
}

/* === HERO SECTION CLEAN === */
.header-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: none;
  border-bottom: 1px solid #e6ecf5; /* single clean line */
  padding: 2.6rem 1rem 1.8rem; /* restore correct vertical spacing */
  margin-bottom: 0;
  overflow: visible;
}

.hero-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  max-width: 640px;
  margin: 0 auto 1.2rem;
}

/* === HERO (single, smaller, smooth ellipse — no clipping) === */

/* === HERO TEXT === */
.hero-text {
  text-align: center;
  max-width: 680px;
  margin: 0 auto;
}

.hero-subline {
  font-size: clamp(1.05rem, 1.7vw, 1.35rem);
  font-weight: 600;
  color: #1b2735;
  max-width: 860px;
  margin: .4rem auto 0;
  line-height: 1.55;
}
.hero-subline strong {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* === IMPACT BAR === */
.impact-bar {
  display: flex;
  justify-content: center;
  gap: 1.4rem;
  flex-wrap: wrap;
  margin-top: 0.8rem;
}
.impact {
  text-align: center;
}
.impact span {
  display: block;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--accent);
}
.impact small {
  font-size: 0.8rem;
  color: var(--muted);
}

/* === AFFILIATIONS === */
/* === VISUAL IMPROVEMENTS FOR AFFILIATIONS MATRIX === */
.section h3 {
  text-align: center;
  font-weight: 700;
  color: var(--ink);
  margin: 3.2rem 0 1.8rem; /* extra space above title and below blue metrics */
}

/* Subtle separator above Affiliations & Degrees */
.section[aria-label="Affiliations and Licensing"] {
  border-top: 1px solid #d8e0eb;
  padding-top: 2.4rem;
  margin-top: 2.8rem;
}

/* === Subtle separator above Affiliations & Degrees === */
.section[aria-label="Affiliations and Licensing"] {
  border-top: 1px solid #d8e0eb;   /* soft neutral line */
  padding-top: 2.2rem;             /* spacing above title */
  margin-top: 2.6rem;              /* separates from blue metrics */
}

/* === AFFILIATIONS (one-row, normalized logos) === */
.affiliations-grid {
  display: flex;
  flex-wrap: nowrap;                      /* keep logos on one line */
  justify-content: center;
  align-items: center;
  gap: clamp(12px, 1.6vw, 22px);
  overflow-x: auto;                        /* safe on narrow viewports */
  padding: .5rem 0 1.2rem;
}

.affiliations-grid .logo {
  height: clamp(22px, 2.7vw, 36px);       /* same visual height */
  width: auto;
  object-fit: contain;
  flex: 0 0 auto;                          /* don’t stretch */
  transition: transform .2s ease, opacity .2s ease;
  opacity: .95;
}
.affiliations-grid .logo:hover {
  transform: translateY(-2px);
  opacity: 1;
}

/* === HERO (final unified version — smooth oval, responsive, non-clipping) === */
.hero-badge {
  position: relative;
  width: clamp(400px, 42vw, 540px);
  height: clamp(340px, 36vw, 440px);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 2.2rem auto 0; /* slightly lower than divider line */
  border-radius: 50% / 47%;
  background: radial-gradient(
    ellipse at 46% 46%,
    rgba(238, 243, 255, 0.96) 0%,
    rgba(243, 247, 255, 0.88) 50%,
    rgba(255, 255, 255, 0.68) 82%,
    rgba(255, 255, 255, 0.38) 100%
  );
  box-shadow: 0 10px 26px rgba(11, 15, 25, 0.15);
  overflow: visible;
  backdrop-filter: blur(2px);
}

.hero-portrait {
  position: relative;
  z-index: 1;
  width: 65%;             /* actually affects final render */
  height: auto;
  margin-top: 2%;         /* gentle vertical centering */
  border-radius: 0;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.25));
  transition: transform 0.3s ease, filter 0.3s ease;
}
.hero-portrait:hover {
  transform: scale(1.02);
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.3));
}

/* === AFFILIATIONS MATRIX — base === */
.affiliations-matrix {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.2rem;
  margin-top: 1.8rem;
  row-gap: 2.2rem;
}

.affiliation-row {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: clamp(1rem, 2vw, 2.5rem);
  text-align: center;
}

.affiliation {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 180px;
}

.affil-logo {
  height: 36px;
  width: auto;
  object-fit: contain;
  margin-bottom: 0.4rem;
  opacity: 0.95;
  transition: transform .2s ease, opacity .2s ease, filter .2s ease;
}
.affil-logo:hover { transform: scale(1.05); opacity: 1; }

.affiliation span {
  font-size: 0.9rem;
  color: #222;
  line-height: 1.3;
  white-space: normal;
}

/* Multiple-logos cell (for Professorships) */
.affiliation.multi .affil-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.4rem;             /* slightly wider gap between university logos */
  margin-top: 1.6rem;      /* more separation from CONICET */
  margin-bottom: 0.6rem;   /* breathing space above professor text */
  flex-wrap: nowrap;       /* keep all 3 university logos on one line */
}
.affiliation.multi .affil-logo.sm {
  height: 30px;
}

.affiliation.multi span {
  white-space: nowrap;
  font-size: 0.9rem;
  line-height: 1.5;
  margin-top: 0.3rem;  /* small gap between logos and text */
}

.affiliation.multi span {
  max-width: 260px;     /* allows wrapping of "Professor: UNT · UNLP · UMN" */
  line-height: 1.35;
}

/* Add breathing space below the section as well */
.about {
  margin-bottom: 3rem;
}

.affiliation.multi .affil-logo.sm { height: 28px; }

/* === Visual hierarchy by row === */
.affiliation-row.degrees   .affil-logo { filter: saturate(0.9) contrast(0.98); }
.affiliation-row.appointments .affil-logo { filter: saturate(0.95) contrast(1); }
.affiliation-row.corporate .affil-logo {
  height: 40px;                      /* slightly larger */
  filter: saturate(1.05) contrast(1.02);
  opacity: 1;                        /* a touch bolder */
}

/* === Responsive === */
@media (max-width: 860px) {
  .affiliation-row { gap: 1.1rem 1.2rem; }
  .affiliation { max-width: 44%; flex: 1 1 44%; }
  .affil-logo { height: 32px; }
  .affiliation span { font-size: 0.88rem; }
}

@media (max-width: 520px) {
  .affiliation-row { gap: .9rem; }
  .affiliation { max-width: 48%; flex: 1 1 48%; }
  .affil-logo { height: 28px; }
  .affiliation.multi .affil-logo.sm { height: 24px; }
  .affiliation span { font-size: 0.85rem; line-height: 1.3; }
}

/* === Optional: custom tooltips (overrides default title bubble) === */
.affil-logo[title]:hover::after {
  content: attr(title);
  position: absolute;
  bottom: -2.2rem;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(15, 20, 30, .95);
  color: #fff;
  font-size: .75rem;
  font-weight: 500;
  padding: 4px 8px;
  border-radius: 6px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  animation: fadeInTooltip .25s forwards ease-out;
  z-index: 50;
}
@keyframes fadeInTooltip {
  from { opacity: 0; transform: translate(-50%, -6px); }
  to   { opacity: 1; transform: translate(-50%, 0); }
}

/* === MOBILE BIO VISIBILITY === */
.mobile-only {
  display: none;
}

@media (max-width: 768px) {
  .content > p { display: none; }        /* hides full bio on mobile */
  .mobile-only { display: block; }       /* shows compact version */
  .bio-condensed p {
    font-size: 0.94rem;
    line-height: 1.45;
    margin-bottom: 1.1rem;
  }
  .bio-condensed a {
    color: var(--accent);
    text-decoration: none;
    border-bottom: 1px dotted var(--accent2);
  }
  .bio-condensed a:hover {
    text-decoration: underline;
  }
}

/* Compact Bio (home) */
.spinelli-compact-bio {
  display: flex;
  justify-content: center;
  margin: 2.5rem 0 1.5rem;
}
.spinelli-compact-wrap {
  text-align: center;
  max-width: 900px;
  width: 100%;
}

.spinelli-compact-avatar {
  margin: 0 auto 0.75rem;
  width: 33%;                 /* 1/3 of original visual width */
  min-width: 180px;           /* keeps it from getting too tiny on phones */
}
.spinelli-compact-avatar img {
  width: 100%;
  height: auto;
  border-radius: 9999px;      /* keeps the oval/circle look */
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
  display: block;
  margin: 0 auto;
}

/* Hero line — cursive, bold, large, clickable */
.spinelli-compact-hero {
  display: inline-block;
  margin-top: .5rem;
  font-family: "Great Vibes", cursive; /* see enqueue below */
  font-weight: 700;
  font-size: clamp(1.5rem, 3.6vw, 2.75rem);
  line-height: 1.2;
  text-decoration: none;
  color: #111;
  transition: transform .15s ease, color .15s ease;
}
.spinelli-compact-hero:hover,
.spinelli-compact-hero:focus {
  color: #0b63f6;
  transform: scale(1.02);
}

/* Full bio page can reuse your current CSS (no change needed) */
/* Compact Bio (home) */
.spinelli-compact-bio{display:flex;justify-content:center;margin:2.5rem 0 1.5rem}
.spinelli-compact-wrap{text-align:center;max-width:900px;width:100%}
.spinelli-compact-avatar{margin:0 auto .75rem;width:33%;min-width:180px}
.spinelli-compact-avatar img{width:100%;height:auto;border-radius:9999px;box-shadow:0 10px 30px rgba(0,0,0,.12);display:block;margin:0 auto}
.spinelli-compact-hero{display:inline-block;margin-top:.5rem;font-family:"Great Vibes",cursive;font-weight:700;font-size:clamp(1.5rem,3.6vw,2.75rem);line-height:1.2;text-decoration:none;color:#111;transition:transform .15s ease,color .15s ease}
.spinelli-compact-hero:hover,.spinelli-compact-hero:focus{color:#0b63f6;transform:scale(1.02)}

/* Full-bio page minor spacing (optional) */
.header-hero .hero-portrait{max-width:680px;width:100%;height:auto}
.impact-bar{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap;margin:1rem auto 0}
.impact{display:flex;flex-direction:column;align-items:center}
.impact span{font-size:1.35rem;font-weight:700}
.affiliations-matrix{margin-top:1rem}
.affiliation-row{display:flex;gap:2rem;justify-content:center;flex-wrap:wrap;margin:.75rem 0}
.affil-logo{height:42px;width:auto}
.affil-logo.sm{height:32px}
.bio-full.desktop-only{display:block}
.bio-condensed.mobile-only{display:none}
@media (max-width:800px){
  .spinelli-compact-avatar{width:48%;min-width:160px}
  .bio-full.desktop-only{display:none}
  .bio-condensed.mobile-only{display:block}
}

/* Full-bio page only (expanded hero) */
.page-template-page-full-bio .header-hero {
  margin-top: 2.25rem;
  margin-bottom: 1.25rem;
}
.page-template-page-full-bio .hero-portrait {
  max-width: 720px;
  width: 100%;
  height: auto;
}
.page-template-page-full-bio .hero-subline {
  max-width: 720px;
  margin: .75rem auto 0;
  line-height: 1.45;
}
.page-template-page-full-bio .impact-bar {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  flex-wrap: wrap;
  margin: .75rem auto 1.25rem;
}
.page-template-page-full-bio .impact span { font-weight: 700; }

/* Ensure the briefing on /about has the same top spacing as home */
.page-template-page-full-bio .section + .section,
.page-template-page-full-bio .about + .section,
.page-template-page-full-bio .about + .spinelli-briefing,
.page-template-page-full-bio .about + .feed-wrap {
  margin-top: 1.75rem;
}

/* Optional: constrain the briefing width to match home if needed */
.page-template-page-full-bio main .feed-wrap,
.page-template-page-full-bio main .spinelli-briefing {
  max-width: 860px;
  margin-left: auto;
  margin-right: auto;
}

.feed-embed.video video,
.feed-embed.video iframe {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
}

/* === Spinelli hero refinements — proportional oval + portrait scaling === */

/* 1. Slightly larger, smoother oval */
.hero-badge {
  width: clamp(420px, 46vw, 620px);  /* was clamp(400px, 42vw, 540px) */
  height: clamp(360px, 40vw, 500px); /* was clamp(340px, 36vw, 440px) */
}

/* 2. Make hero portrait scale as a percentage of the oval */
.header-hero .hero-portrait,
.page-template-page-full-bio .hero-portrait {
  width: 68%;        /* scales with ellipse size; tweak 60–75% for taste */
  max-width: none;   /* remove hard pixel cap */
  height: auto;
  margin-top: 1.5%;  /* gentle vertical centering inside ellipse */
  border-radius: 0;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.25));
  transition: transform 0.3s ease, filter 0.3s ease;
}

/* 3. Preserve hover effect */
.header-hero .hero-portrait:hover {
  transform: scale(1.02);
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.3));
}
/* removed for next one on 11/5/2025 11:58 AM EST .feed-embed video { background:#000; }
/* iPhone/Safari: make video fill the 16:9 card cleanly */
.feed-embed.video { position: relative; background: #000; }
.feed-embed.video::before { content: ""; display: block; padding-top: 56.25%; } /* 16:9 */
.feed-embed.video > video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; /* fill area nicely */
  display: block;
}

/* Spinelli Daily Briefing – card description "more" link */
.spinelli-card-more {
  border: none;
  background: none;
  padding: 0;
  margin-left: .15rem;
  color: #0050b3;
  font-size: .88rem;
  cursor: pointer;
  text-decoration: none;
}

.spinelli-card-more:hover,
.spinelli-card-more:focus {
  text-decoration: underline;
}

/* === Hero sizing via CSS variables (single source of truth) === */
:root {
  /* Full Bio (base) oval size */
  --hero-width:  clamp(420px, 46vw, 620px);
  --hero-height: clamp(360px, 40vw, 500px);

  /* Portrait fill inside the oval (0.68 = 68%) */
  --hero-portrait-scale: 0.68;

  /* Home (compact) scale factor vs. Full Bio */
  --hero-compact-scale: 0.30; /* tweak to 0.40, 0.60, etc. */

  /* How much to raise the compact oval to the H1 line (desktop) */
  --hero-lift: 8rem; /* try 6–10rem to align perfectly with your H1 */
}

/* Full Bio hero uses the base size */
.header-hero .hero-badge,
.page-template-page-full-bio .hero-badge,
.hero-badge:not(.hero-badge--compact) {
  width:  var(--hero-width);
  height: var(--hero-height);
}

/* Portrait proportion (both pages) */
.header-hero .hero-portrait,
.page-template-page-full-bio .hero-portrait,
.spinelli-compact-bio .hero-portrait {
  width: calc(100% * var(--hero-portrait-scale));
  max-width: none;
  height: auto;
  margin-top: 1.5%;
  border-radius: 0;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.25));
  transition: transform .3s ease, filter .3s ease;
}
.header-hero .hero-portrait:hover,
.spinelli-compact-bio .hero-portrait:hover {
  transform: scale(1.02);
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.3));
}

/* Retire old round avatar on home */
.spinelli-compact-avatar { display: none !important; }

/* ---------- Home (compact) layout ---------- */

/* Mobile/tablet first: center the oval; keep readable minimums */
@media (max-width: 899px) {
  .spinelli-compact-bio .hero-badge,
  .hero-badge--compact {
    position: static;
    margin: 1rem auto 0;
    width:  clamp(210px, 58vw, 340px);
    height: calc(clamp(210px, 58vw, 340px) * 0.82);
    border-radius: 50% / 47%;
    background: radial-gradient(
      ellipse at 46% 46%,
      rgba(238,243,255,.96) 0%,
      rgba(243,247,255,.88) 50%,
      rgba(255,255,255,.68) 82%,
      rgba(255,255,255,.38) 100%
    );
    box-shadow: 0 10px 26px rgba(11,15,25,.15);
    overflow: visible;
    backdrop-filter: blur(2px);
  }
  .spinelli-compact-hero { margin-top: .6rem; text-align:center; padding-right:0; }
}

/* Desktop: dock to the right and lift to H1 line */
@media (min-width: 900px) {
  main.site-main { position: relative; }  /* positioning context */

  .spinelli-compact-bio {
    position: relative;
    min-height: calc(var(--hero-height) * var(--hero-compact-scale)); /* reserve space */
    margin-top: 0;
  }

  .spinelli-compact-bio .hero-badge,
  .hero-badge--compact {
    position: absolute;
    right: 0;
    top: calc(-1 * var(--hero-lift));      /* ← lift to headline line */
    margin: 0;
    width:  calc(var(--hero-width)  * var(--hero-compact-scale));
    height: calc(var(--hero-height) * var(--hero-compact-scale));
    border-radius: 50% / 47%;
    background: radial-gradient(
      ellipse at 46% 46%,
      rgba(238,243,255,.96) 0%,
      rgba(243,247,255,.88) 50%,
      rgba(255,255,255,.68) 82%,
      rgba(255,255,255,.38) 100%
    );
    box-shadow: 0 10px 26px rgba(11,15,25,.15);
    overflow: visible;
    backdrop-filter: blur(2px);
    z-index: 2;
  }

  /* Keep the cursive line out from under the oval */
  .spinelli-compact-hero {
    display: block;
    text-align: left;
    padding-right: calc(var(--hero-width) * var(--hero-compact-scale) + 1rem);
    margin-top: .5rem;
  }
}

/* === Align compact oval with WP tagline line (desktop only) === */
@media (min-width: 900px) {
  :root {
    /* raise more so it reaches the header/tagline line; tweak until perfect */
    --hero-lift: 12rem; /* try 11–14rem depending on your header height */
  }

  /* keep it at the far-right edge of your content */
  .spinelli-compact-bio .hero-badge,
  .hero-badge--compact {
    right: 0;
    top: calc(-1 * var(--hero-lift));
  }

  /* let your cursive line sit naturally under the H1 (no extra carve-out) */
  .spinelli-compact-hero {
    padding-right: 0;
    text-align: left; /* or center if you prefer */
  }
}
/* === Spinelli metrics row === */
.spinelli-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1.25rem;
  align-items: start;
  text-align: center;
  margin: 1rem 0 2rem;
}
.spinelli-metric__value {
  font-weight: 800;
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  line-height: 1.1;
  color: #1662ff;
}
.spinelli-metric__label {
  font-size: clamp(0.85rem, 1.6vw, 1rem);
  color: #555;
}
.spinelli-compact-bio .spinelli-metrics { margin-top: 0.75rem; }
/* === Unified metrics row (horizontal banner style) === */
.spinelli-metrics {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: baseline;
  gap: 3rem;               /* spacing between items */
  margin-top: 1rem;
  margin-bottom: 1.5rem;
  text-align: center;
  font-family: "Merriweather", serif;
}

.spinelli-metric {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 5rem;
}

.spinelli-metric__value {
  font-size: 2rem;
  font-weight: 700;
  color: #0066ff;          /* your blue tone */
  line-height: 1.2;
}

.spinelli-metric__label {
  font-size: 1.1rem;
  color: #555;
  margin-top: 0.25rem;
  line-height: 1.2;
}

/* Optional tweak for compact layout under "Godfather..." line */
.spinelli-compact-bio .spinelli-metrics {
  margin-top: 0.75rem;
  gap: 2rem;
}
/* === Mini metrics bar (shared by home + full bio) === */
.mini-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .8rem 1.4rem;
  margin: .6rem auto 0;
  max-width: 920px;
}

.mini-metrics .metric {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: .15rem;
  text-align: center;
  min-width: 86px;
}

.mini-metrics .val {
  font-size: .98rem;
  font-weight: 700;
  color: var(--accent, #0057ff);
  line-height: 1.1;
}

.mini-metrics .label {
  font-size: .78rem;
  color: var(--muted, #666);
  line-height: 1.2;
}

.mini-metrics .icon {
  width: 18px;
  height: 18px;
  border-radius: 4px;
  object-fit: cover;
  box-shadow: 0 1px 3px rgba(0,0,0,.15);
  margin-bottom: .1rem;
}
/* === Mini metrics bar (shared by home + full bio) — color synced === */

.mini-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.9rem 1.8rem;
  margin: 0.7rem auto 0;
  max-width: 920px;
  font-family: 'Inter', system-ui, sans-serif;
}

.mini-metrics .metric {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.18rem;
  min-width: 86px;
}

.mini-metrics .val {
  font-size: 1rem;
  font-weight: 700;
  color: #0057ff; /* Spinelli blue accent */
  line-height: 1.15;
  letter-spacing: 0.02em;
}

.mini-metrics .label {
  font-size: 0.78rem;
  color: #666; /* muted gray labels */
  line-height: 1.25;
  letter-spacing: 0.01em;
}

.mini-metrics .icon {
  width: 18px;
  height: 18px;
  border-radius: 4px;
  object-fit: cover;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  margin-bottom: 0.1rem;
}

/* smooth responsive scaling */
@media (max-width: 640px) {
  .mini-metrics .val { font-size: 0.95rem; }
  .mini-metrics .label { font-size: 0.74rem; }
}
.mini-metrics .js-crt-counter { white-space: nowrap; }

.excerpt {
  transition: max-height 0.25s ease-in-out;
}

.spinelli-more-btn:hover {
  text-decoration: underline;
}
/* Inline "… more" link in card excerpts */
.spinelli-excerpt-more-link {
  font-weight: 700;          /* bold */
  font-style: italic;        /* italic */
  text-decoration: underline;
  cursor: pointer;
}
/* === Spinelli Daily Briefing: excerpt expand / collapse === */

/* When JS expands the excerpt, remove any clamping / clipping */
.spinelli-briefing .card .excerpt.spinelli-excerpt-expanded {
  /* kill line clamp / truncation */
  -webkit-line-clamp: initial;
  line-clamp: initial;
  max-height: none;
  overflow: visible;
  display: block; /* ensure normal block flow */
}

/* Inline "… more" / "… less" at the end of the excerpt */
.spinelli-briefing .card .excerpt .spinelli-excerpt-more-link {
  font-weight: 700;        /* bold */
  font-style: italic;      /* italic */
  text-decoration: underline;
  cursor: pointer;
  white-space: nowrap;     /* keep '… more' together on one line if possible */
}

/* Optional: slightly dim it on hover to feel interactive */
.spinelli-briefing .card .excerpt .spinelli-excerpt-more-link:hover,
.spinelli-briefing .card .excerpt .spinelli-excerpt-more-link:focus {
  opacity: 0.8;
}
/* Spinelli Daily Briefing – inline "… more / less" link inside excerpts */
.spinelli-briefing .excerpt .excerpt-toggle {
  font-weight: 700;          /* bold */
  font-style: italic;        /* italic */
  text-decoration: underline;
  cursor: pointer;
  color: inherit;            /* same color as the excerpt text */
  white-space: nowrap;       /* keeps "… more" together nicely */
}
/* Base excerpt styling */
.spinelli-briefing .card .excerpt {
  margin: 0.4rem 0 0.5rem;
  font-size: 0.95rem;
  line-height: 1.4;
  overflow: visible;      /* allow full text when expanded */
}

/* "more" / "less" link */
.spinelli-briefing .card .excerpt .excerpt-toggle {
  font-weight: 600;       /* boldish */
  font-style: italic;     /* italic */
  text-decoration: underline;
  cursor: pointer;
}