/*
Theme Name: The Missing Clue V0.2.3
Theme URI: https://themissingclue.com/
Author: The Missing Clue
Description: Story-first editorial WordPress theme for The Missing Clue.
Version: 0.2.3
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: the-missing-clue
License: GPL-2.0-or-later
*/

:root{
  --tmc-ink:#171717;
  --tmc-black:#0d0d0d;
  --tmc-cream:#f5f1e9;
  --tmc-paper:#fbfaf7;
  --tmc-muted:#77736c;
  --tmc-line:#ddd8cf;
  --tmc-red:#8f2f2a;
  --tmc-red-bright:#a73731;
  --tmc-max:1240px;
  --tmc-reading:720px;
  --tmc-serif: Georgia, "Times New Roman", serif;
  --tmc-sans: Arial, Helvetica, sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--tmc-paper);
  color:var(--tmc-ink);
  font-family:var(--tmc-sans);
  line-height:1.65;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input{font:inherit}

.tmc-container{width:min(var(--tmc-max),calc(100% - 40px));margin-inline:auto}

/* Header */
.tmc-header{
  background:var(--tmc-black);
  color:#fff;
  border-bottom:1px solid #2a2a2a;
}
.tmc-header-inner{
  min-height:150px;
  display:flex;
  align-items:center;
  gap:28px;
}
.tmc-brand{
  display:flex;
  flex:0 0 auto;
  flex-direction:column;
  align-items:flex-start;
  text-decoration:none;
  min-width:0;
  margin:0;
}
.tmc-brand .custom-logo-link{
  display:block;
  line-height:0;
}
.tmc-brand .custom-logo{
  display:block;
  width:360px;
  height:auto;
  max-width:100%;
  max-height:100px;
  object-fit:contain;
  object-position:left center;
}
.tmc-brand-name{
  font-family:var(--tmc-serif);
  font-size:25px;
  line-height:1;
  letter-spacing:-.03em;
  text-transform:uppercase;
}
.tmc-brand-tagline{
  display:none !important;
}
.tmc-nav{margin-left:auto;flex:0 0 auto}
.tmc-nav ul{display:flex;gap:24px;list-style:none;margin:0;padding:0}
.tmc-nav a{
  color:#eee;
  text-decoration:none;
  text-transform:uppercase;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
}
.tmc-nav a:hover,.tmc-nav .current-menu-item>a{color:#d99b96}
.tmc-search-toggle{
  border:0;background:none;color:#fff;cursor:pointer;padding:8px;font-size:18px
}
.tmc-mobile-toggle{display:none;border:0;background:none;color:#fff;font-size:25px}

/* Search */
.tmc-search-panel{display:none;background:#111;border-top:1px solid #2b2b2b;padding:18px 0}
.tmc-search-panel.is-open{display:block}
.tmc-search-form{display:flex;gap:10px;max-width:760px;margin:auto}
.tmc-search-form input{
  flex:1;padding:13px 15px;border:1px solid #444;background:#202020;color:#fff
}
.tmc-button{
  display:inline-block;background:var(--tmc-red);color:#fff;text-decoration:none;
  border:0;padding:12px 18px;text-transform:uppercase;font-size:11px;font-weight:700;
  letter-spacing:.05em;cursor:pointer
}
.tmc-button:hover{background:var(--tmc-red-bright)}

/* Hero slider */
.tmc-hero-slider{
  position:relative;width:100vw;max-width:100vw;height:var(--tmc-hero-height,560px);min-height:var(--tmc-hero-height,560px);margin-left:calc(50% - 50vw);
  background:#111;overflow:hidden;margin:0;padding:0;display:block;
}
.tmc-hero-slides,.tmc-hero-slide,.tmc-hero-image{
  position:absolute;inset:0;width:100%;height:100%;
}
.tmc-hero-slide{opacity:0;visibility:hidden;transition:opacity .55s ease;z-index:0}
.tmc-hero-slide.is-active{opacity:1;visibility:visible;z-index:1}
.tmc-hero-image{object-fit:cover;object-position:center center;max-width:none}
.tmc-hero-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:48px;height:48px;
  border:1px solid rgba(255,255,255,.45);border-radius:50%;background:rgba(0,0,0,.38);
  color:#fff;cursor:pointer;font-size:20px;line-height:1;display:grid;place-items:center;
  transition:background .2s ease,border-color .2s ease
}
.tmc-hero-arrow:hover,.tmc-hero-arrow:focus-visible{background:rgba(0,0,0,.7);border-color:#fff}
.tmc-hero-prev{left:24px}.tmc-hero-next{right:24px}
.tmc-hero-dots{
  position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:4;
  display:flex;gap:8px;padding:7px 10px;border-radius:999px;background:rgba(0,0,0,.35)
}
.tmc-hero-dot{width:9px;height:9px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.55);cursor:pointer}
.tmc-hero-dot.is-active{background:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.2)}

/* Sections */
.tmc-section{padding:58px 0}
.tmc-section-head{display:flex;align-items:center;gap:16px;margin-bottom:22px}
.tmc-section-title{
  margin:0;text-transform:uppercase;font-size:13px;letter-spacing:.08em;white-space:nowrap
}
.tmc-rule{height:1px;background:var(--tmc-line);flex:1}
.tmc-section-link{font-size:11px;text-decoration:none;color:var(--tmc-muted);white-space:nowrap}

/* Cards */
.tmc-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tmc-card{background:#fff;border:1px solid #e5e0d8}
.tmc-card-image{aspect-ratio:1.55;overflow:hidden;background:#ddd}
.tmc-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.tmc-card:hover .tmc-card-image img{transform:scale(1.03)}
.tmc-card-body{padding:18px}
.tmc-card h3{font-family:var(--tmc-serif);font-size:23px;line-height:1.15;margin:7px 0 10px}
.tmc-card-excerpt{font-size:13px;color:#555;margin:0 0 10px}
.tmc-meta{font-size:10px;color:var(--tmc-muted);text-transform:uppercase;letter-spacing:.04em}
.tmc-category{font-size:10px;color:var(--tmc-red);font-weight:800;text-transform:uppercase;letter-spacing:.08em}

/* Signature banner */
.tmc-feature-banner{
  position:relative;overflow:hidden;min-height:220px;background:#171717;color:#fff;
}
.tmc-feature-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.42}
.tmc-feature-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#111 0%,rgba(17,17,17,.72),rgba(17,17,17,.2))}
.tmc-feature-banner-content{position:relative;z-index:1;padding:42px;max-width:620px}
.tmc-feature-banner h2{font-family:var(--tmc-serif);font-size:38px;line-height:1.08;margin:8px 0 18px}

/* Category tiles */
.tmc-category-grid{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid var(--tmc-line)}
.tmc-category-tile{
  padding:24px 10px;text-align:center;border-right:1px solid var(--tmc-line);text-decoration:none;background:#fff
}
.tmc-category-tile:last-child{border-right:0}
.tmc-category-icon{font-size:25px;margin-bottom:8px}
.tmc-category-tile span{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}

/* Lists */
.tmc-two-col{display:grid;grid-template-columns:1.2fr .8fr;gap:44px}
.tmc-list{display:grid;gap:16px}
.tmc-list-item{display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:center}
.tmc-list-image{aspect-ratio:1.35;background:#ddd;overflow:hidden}
.tmc-list-image img{width:100%;height:100%;object-fit:cover}
.tmc-list h3{font-family:var(--tmc-serif);font-size:17px;line-height:1.2;margin:4px 0}
.tmc-rank-list{counter-reset:rank;list-style:none;margin:0;padding:0}
.tmc-rank-list li{counter-increment:rank;display:grid;grid-template-columns:35px 1fr;gap:12px;padding:13px 0;border-bottom:1px solid var(--tmc-line)}
.tmc-rank-list li:before{content:counter(rank,decimal-leading-zero);color:var(--tmc-muted);font-size:13px}

/* Newsletter */
.tmc-newsletter{background:#eee8de;padding:34px}
.tmc-newsletter-inner{display:flex;align-items:center;gap:30px;justify-content:space-between}
.tmc-newsletter h2{font-family:var(--tmc-serif);margin:0 0 5px;font-size:28px}
.tmc-newsletter p{margin:0;color:#5e5a54;font-size:13px}
.tmc-newsletter-form{display:flex;min-width:420px}
.tmc-newsletter-form input{flex:1;border:1px solid #bbb2a6;padding:12px;background:#fff}

/* Article */
.tmc-breadcrumbs{padding:20px 0;font-size:11px;color:var(--tmc-muted);border-bottom:1px solid var(--tmc-line)}
.tmc-article-header{padding:54px 0 28px;max-width:980px}
.tmc-article-header h1{
  font-family:var(--tmc-serif);font-size:clamp(42px,5vw,68px);line-height:1.02;
  letter-spacing:-.035em;margin:10px 0 16px
}
.tmc-article-deck{font-size:20px;color:#555;max-width:780px}
.tmc-byline{display:flex;gap:12px;align-items:center;font-size:12px;color:#68645d;margin-top:20px}
.tmc-author-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;background:#ddd}
.tmc-share{margin-left:auto;display:flex;gap:7px}
.tmc-share a{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#eee9e1;text-decoration:none}
.tmc-article-hero{margin:0 auto 38px;max-width:1100px}
.tmc-article-hero img{width:100%;max-height:650px;object-fit:cover}
.tmc-caption{font-size:10px;color:#777;margin-top:7px}
.tmc-reading-column{width:min(var(--tmc-reading),calc(100% - 40px));margin:auto}
.tmc-content{font-family:var(--tmc-serif);font-size:19px;line-height:1.85}
.tmc-content p{margin:0 0 1.25em}
.tmc-content h2,.tmc-content h3{line-height:1.2;margin:1.7em 0 .55em}
.tmc-content h2{font-size:31px}.tmc-content h3{font-size:24px}
.tmc-content blockquote{
  margin:32px 0;padding:4px 0 4px 24px;border-left:3px solid var(--tmc-red);
  font-size:24px;line-height:1.4;font-style:italic
}
.tmc-ad{
  margin:35px 0;background:#eeeae3;color:#8b877f;min-height:90px;
  display:grid;place-items:center;font:10px var(--tmc-sans);letter-spacing:.08em
}
.tmc-post-footer{margin-top:50px;padding-top:28px;border-top:1px solid var(--tmc-line)}

/* Archive */
.tmc-page-title{padding:55px 0 28px}
.tmc-page-title h1{font-family:var(--tmc-serif);font-size:52px;line-height:1.05;margin:8px 0}
.tmc-archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-bottom:60px}

/* Footer */
.tmc-footer{background:#111;color:#fff;margin-top:60px;padding:48px 0 25px}
.tmc-footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px}
.tmc-footer h2{font-family:var(--tmc-serif);font-size:24px;margin:0 0 12px}
.tmc-footer h3{text-transform:uppercase;font-size:11px;letter-spacing:.08em}
.tmc-footer p,.tmc-footer a{color:#aaa;font-size:12px}
.tmc-footer a{text-decoration:none}
.tmc-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.tmc-copyright{border-top:1px solid #2d2d2d;margin-top:35px;padding-top:16px;color:#777;font-size:10px}

/* Accessibility */
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid #d48b84;outline-offset:3px}

/* Responsive */
@media(max-width:1000px){
  .tmc-nav ul{gap:14px}
  .tmc-brand{min-width:210px}
  .tmc-category-grid{grid-template-columns:repeat(3,1fr)}
  .tmc-category-tile:nth-child(3){border-right:0}
  .tmc-category-tile{border-bottom:1px solid var(--tmc-line)}
  .tmc-two-col{grid-template-columns:1fr}
}
@media(max-width:760px){
  .tmc-container{width:min(var(--tmc-max),calc(100% - 28px))}
  .tmc-header-inner{min-height:80px;justify-content:space-between}
  .tmc-brand{min-width:0;flex:0 1 auto}
  .tmc-brand .custom-logo{width:250px;max-height:70px}
  .tmc-brand-tagline{display:none !important}
  .tmc-mobile-toggle{display:block}
  .tmc-nav{display:none;position:absolute;left:0;right:0;top:80px;background:#111;padding:20px;z-index:20}
  .tmc-nav.is-open{display:block}
  .tmc-nav ul{display:grid;gap:17px}
  .tmc-search-toggle{margin-left:auto}
  .tmc-hero-slider{height:clamp(340px,58vw,500px);min-height:340px}
  .tmc-hero-arrow{width:42px;height:42px}
  .tmc-hero-prev{left:14px}.tmc-hero-next{right:14px}
  .tmc-card-grid,.tmc-archive-grid{grid-template-columns:1fr}
  .tmc-card h3{font-size:25px}
  .tmc-section{padding:42px 0}
  .tmc-category-grid{grid-template-columns:repeat(2,1fr)}
  .tmc-category-tile:nth-child(3){border-right:1px solid var(--tmc-line)}
  .tmc-category-tile:nth-child(even){border-right:0}
  .tmc-newsletter-inner{display:block}
  .tmc-newsletter-form{min-width:0;margin-top:20px}
  .tmc-article-header{padding:35px 0 22px}
  .tmc-article-header h1{font-size:42px}
  .tmc-article-deck{font-size:18px}
  .tmc-share{display:none}
  .tmc-content{font-size:18px;line-height:1.8}
  .tmc-footer-grid{grid-template-columns:1fr}
}
