/* Talent Market Pulse — news desk
   Barlow Condensed headlines, Inter body, coral accent. Fonts self-hosted. */

@font-face{font-family:'Barlow Condensed';src:url('../fonts/BarlowCondensed-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Barlow Condensed';src:url('../fonts/BarlowCondensed-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Barlow Condensed';src:url('../fonts/BarlowCondensed-800.woff2') format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/Inter-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/Inter-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/Inter-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/Inter-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('../fonts/JetBrainsMono-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('../fonts/JetBrainsMono-500.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --white:#FFFFFF;--black:#0A0A0A;--gray-900:#171717;--gray-800:#262626;--gray-700:#404040;
  --gray-500:#737373;--gray-300:#D4D4D4;--gray-100:#F5F5F5;
  --coral-500:#FF4D30;--coral-600:#E8412A;--coral-400:#FF6B52;--coral-300:#FF9485;
  --teal-500:#14B8A6;--teal-600:#0D9488;--trending:#F59E0B;--live:#EF4444;
  --font-display:'Barlow Condensed','Arial Narrow','Helvetica Neue',sans-serif;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',monospace;
  --space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;
  --space-2xl:48px;--space-3xl:64px;
  --container-sm:640px;--container-lg:1024px;--container-xl:1280px;
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--white);color:var(--gray-900);
  font-family:var(--font-body);font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--coral-500);text-decoration:none}
a:hover{color:var(--coral-600);text-decoration:underline;text-underline-offset:2px}
.wrap{max-width:var(--container-xl);margin:0 auto;padding:0 var(--space-lg)}
.wrap--narrow{max-width:var(--container-sm)}
.wrap--grid{max-width:var(--container-lg)}

/* ---- Breaking bar ---- */
.tmp-breaking{background:var(--black);color:var(--white);font-family:var(--font-body);
  font-size:.6875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.tmp-breaking .wrap{display:flex;align-items:center;gap:var(--space-md);
  padding-top:var(--space-sm);padding-bottom:var(--space-sm)}
.tmp-dot{width:8px;height:8px;border-radius:50%;background:var(--live);flex:0 0 8px;
  animation:tmp-pulse 1.8s ease-in-out infinite}
@keyframes tmp-pulse{0%,100%{opacity:1}50%{opacity:.25}}
.tmp-breaking a{color:var(--white)}

/* ---- Masthead ---- */
.tmp-head{border-bottom:2px solid var(--black);position:sticky;top:0;z-index:50;background:var(--white)}
.tmp-head .wrap{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-lg);
  padding-top:var(--space-md);padding-bottom:var(--space-md);flex-wrap:wrap}
.tmp-brand{font-family:var(--font-display);font-weight:800;font-size:1.75rem;line-height:1;
  letter-spacing:-.02em;text-transform:uppercase;color:var(--black)}
.tmp-brand:hover{color:var(--coral-500);text-decoration:none}
.tmp-nav{display:flex;gap:var(--space-md);flex-wrap:wrap;font-size:.8125rem;font-weight:600}
.tmp-nav a{color:var(--gray-700);text-transform:uppercase;letter-spacing:.04em}
.tmp-nav a:hover{color:var(--coral-500);text-decoration:none}
.tmp-nav .nav-current a{color:var(--coral-500);border-bottom:2px solid var(--coral-500)}

/* ---- Labels + meta ---- */
.tmp-label{display:inline-block;font-size:.6875rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--coral-500)}
.tmp-label--tag{background:var(--gray-100);color:var(--gray-700);padding:2px 8px;border-radius:3px}
.tmp-time{font-family:var(--font-mono);font-size:.75rem;font-weight:500;color:var(--gray-500)}

/* ---- Hero ---- */
.tmp-hero{padding:var(--space-2xl) 0 var(--space-xl);border-bottom:1px solid var(--gray-300)}
.tmp-hero__title{font-family:var(--font-display);font-size:clamp(2.25rem,6vw,3.5rem);font-weight:800;
  line-height:1.05;letter-spacing:-.02em;text-transform:uppercase;margin:var(--space-sm) 0;color:var(--black)}
.tmp-hero__title a{color:inherit}
.tmp-hero__title a:hover{color:var(--coral-500);text-decoration:none}
.tmp-hero__excerpt{font-size:1.125rem;color:var(--gray-700);max-width:52ch}

/* ---- Card grid ---- */
.tmp-section-title{font-family:var(--font-display);font-size:1.5rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.01em;margin:var(--space-2xl) 0 var(--space-md);
  padding-bottom:var(--space-sm);border-bottom:2px solid var(--black)}
.tmp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-lg)}
.tmp-card{border:1px solid var(--gray-300);border-radius:4px;padding:var(--space-lg);
  display:flex;flex-direction:column;gap:var(--space-sm);transition:border-color .2s,transform .2s}
.tmp-card:hover{border-color:var(--coral-500);transform:translateY(-2px)}
.tmp-card__title{font-family:var(--font-display);font-size:1.35rem;font-weight:700;line-height:1.2;
  margin:0;color:var(--black)}
.tmp-card__title a{color:inherit}
.tmp-card__title a:hover{color:var(--coral-500);text-decoration:none}
.tmp-card__excerpt{font-size:.875rem;line-height:1.55;color:var(--gray-500);margin:0}
.tmp-card__foot{margin-top:auto;display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap}

/* ---- Article ---- */
.tmp-article{padding:var(--space-2xl) 0}
.tmp-article__head{max-width:var(--container-lg);margin:0 auto var(--space-xl)}
.tmp-article__title{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.5rem);font-weight:800;
  line-height:1.05;letter-spacing:-.02em;margin:var(--space-sm) 0;color:var(--black)}
.tmp-article__meta{display:flex;gap:var(--space-md);align-items:center;flex-wrap:wrap;
  padding-top:var(--space-md);border-top:1px solid var(--gray-300)}
.tmp-article__body{font-size:1rem;line-height:1.75;color:var(--gray-900)}
.tmp-article__body h2{font-family:var(--font-display);font-size:2.25rem;font-weight:700;line-height:1.1;
  margin:var(--space-2xl) 0 var(--space-md)}
.tmp-article__body h3{font-family:var(--font-display);font-size:1.5rem;font-weight:700;line-height:1.2;
  margin:var(--space-xl) 0 var(--space-sm)}
.tmp-article__body h4{font-size:1.125rem;font-weight:600;margin:var(--space-lg) 0 var(--space-sm)}
.tmp-article__body p{margin:0 0 var(--space-lg)}
.tmp-article__body ul,.tmp-article__body ol{margin:0 0 var(--space-lg);padding-left:1.35em}
.tmp-article__body li{margin-bottom:var(--space-sm)}
.tmp-article__body a{text-decoration:underline;text-underline-offset:2px}
.tmp-article__body strong{color:var(--black);font-weight:600}
.tmp-article__body blockquote{margin:var(--space-xl) 0;padding-left:var(--space-lg);
  border-left:3px solid var(--coral-500);font-size:1.125rem;color:var(--gray-700)}
.tmp-article__body code{font-family:var(--font-mono);font-size:.9em;background:var(--gray-100);
  padding:.1em .35em;border-radius:3px}
.tmp-article__body figure{margin:var(--space-xl) 0}
.tmp-article__body figcaption{font-size:.75rem;color:var(--gray-500);text-align:center;
  margin-top:var(--space-sm)}

/* ---- Footer ---- */
.tmp-foot{margin-top:var(--space-3xl);background:var(--gray-900);color:var(--gray-300);
  padding:var(--space-2xl) 0}
.tmp-foot .wrap{display:flex;justify-content:space-between;gap:var(--space-lg);flex-wrap:wrap;
  align-items:flex-start}
.tmp-foot__brand{font-family:var(--font-display);font-weight:800;font-size:1.5rem;
  text-transform:uppercase;color:var(--white)}
.tmp-foot a{color:var(--coral-400)}
.tmp-foot__meta{font-size:.75rem;color:var(--gray-500);text-transform:uppercase;letter-spacing:.06em}

/* ---- Pagination ---- */
.tmp-pager{display:flex;justify-content:space-between;gap:var(--space-md);
  margin:var(--space-2xl) 0;font-family:var(--font-display);font-weight:700;text-transform:uppercase}
.tmp-pager span{color:var(--gray-300)}

@media (max-width:600px){
  .tmp-head .wrap{flex-direction:column;align-items:flex-start;gap:var(--space-sm)}
}