/*
Theme Name: Horn Dynamics Redesign
Theme URI: https://horndynamics.com
Description: Rift-geology visual redesign of Horn Dynamics. Child theme of ColorMag.
Author: Horn Dynamics
Template: colormag
Version: 1.0
*/

:root{
  --ink:#211d17; --charcoal:#17140f; --sand:#f1ead9; --sand-2:#e7dec8;
  --rust:#bd431d; --teal:#345d55; --line:#c9bea0;
  --serif:'Fraunces',Georgia,serif; --sans:'IBM Plex Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',Menlo,monospace;
}
@media (prefers-color-scheme: dark){
  :root{ --ink:#ece4d3; --sand:#161310; --sand-2:#1e1a15; --line:#3a342a; --charcoal:#0c0a08; }
}
*{ box-sizing:border-box; }
html{ font-size:16px !important; }
body{
  margin:0; background:var(--sand); color:var(--ink); font-family:var(--sans);
  -webkit-font-smoothing:antialiased; line-height:1.5;
}
a{ color:inherit; }
.wrap{ max-width:1120px; margin:0 auto; padding:0 28px; }

/* header */
header.top{ background:var(--charcoal); color:var(--sand); position:relative; overflow:hidden; }
.topbar{ position:relative; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 28px; flex-wrap:wrap; }
.brand{ display:flex; align-items:baseline; gap:12px; text-decoration:none; }
.brand-mark{ font-family:var(--serif); font-weight:700; font-size:1.5rem; letter-spacing:-.01em; }
.brand-tag{ font-family:var(--mono); font-size:.68rem; color:#a89a78; letter-spacing:.03em; }
nav.cats{ display:flex; gap:22px; flex-wrap:wrap; font-size:.85rem; }
nav.cats a{ text-decoration:none; color:#d8cdb2; border-bottom:1px solid transparent; padding-bottom:2px; transition:border-color .15s, color .15s; }
nav.cats a:hover{ color:var(--sand); border-color:var(--rust); }

/* hero */
.hero{ padding:64px 0 52px; border-bottom:1px solid var(--line); }
.hero-grid{ display:grid; grid-template-columns:1.25fr 1fr; gap:56px; align-items:start; }
.kicker{ font-family:var(--mono); font-size:.72rem; color:var(--rust); letter-spacing:.02em; margin:0 0 14px; text-transform:none; }
.hero h1{ font-family:var(--serif); font-weight:600; font-size:clamp(2.1rem,4vw,3.1rem); line-height:1.08; margin:0 0 20px; letter-spacing:-.01em; }
.hero p.lede{ font-size:1.05rem; max-width:56ch; opacity:.82; margin:0 0 26px; }
.hero-meta{ display:flex; gap:22px; flex-wrap:wrap; font-family:var(--mono); font-size:.78rem; opacity:.65; margin-bottom:26px; }
.readlink{ display:inline-flex; align-items:center; gap:8px; font-family:var(--sans); font-weight:600; font-size:.92rem; text-decoration:none; color:var(--rust); }
.readlink svg{ transition:transform .15s; }
.readlink:hover svg{ transform:translateX(3px); }

.seis{ border:1px solid var(--line); background:var(--sand-2); padding:20px 22px 22px; }
.seis-label{ font-family:var(--mono); font-size:.68rem; opacity:.6; display:flex; justify-content:space-between; margin-bottom:10px; }
.seis svg{ width:100%; height:auto; display:block; }
.seis-path{ stroke-dasharray:900; stroke-dashoffset:900; animation:draw 2.4s ease-out forwards; }
@keyframes draw{ to{ stroke-dashoffset:0; } }
@media (prefers-reduced-motion: reduce){ .seis-path{ animation:none; stroke-dashoffset:0; } }
.seis-stats{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:16px; font-family:var(--mono); font-size:.72rem; }
.seis-stats div span{ display:block; }
.seis-stats .v{ font-size:1rem; color:var(--ink); margin-top:2px; }
.seis-stats .k{ opacity:.55; }

/* reports list (homepage + archives + search) */
.reports{ padding:56px 0 20px; }
.section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:8px; }
.section-head h2{ font-family:var(--serif); font-weight:600; font-size:1.5rem; margin:0; }
.section-head span{ font-family:var(--mono); font-size:.72rem; opacity:.5; }

.row{ display:grid; grid-template-columns:180px 1fr; gap:28px; padding:26px 0; border-top:1px solid var(--line); align-items:start; text-decoration:none; color:inherit; }
.row:hover .row-title{ color:var(--rust); }
.row-meta{ font-family:var(--mono); font-size:.74rem; opacity:.65; display:flex; flex-direction:column; gap:6px; }
.row-meta .tag{ display:inline-block; width:fit-content; padding:2px 8px; border:1px solid var(--line); font-size:.68rem; }
.row-title{ font-family:var(--serif); font-weight:600; font-size:1.28rem; line-height:1.25; margin:0 0 8px; display:block; transition:color .15s; }
.row-excerpt{ margin:0; font-size:.95rem; opacity:.78; max-width:62ch; }

.archive-head{ padding:44px 0 8px; }
.archive-title{ font-family:var(--serif); font-weight:600; font-size:2rem; margin:0; }

/* single post */
.single-article{ padding:48px 0 20px; max-width:780px; }
.single-title{ font-family:var(--serif); font-weight:600; font-size:clamp(1.9rem,3.6vw,2.6rem); line-height:1.12; margin:10px 0 18px; }
.single-thumb img{ width:100%; height:auto; display:block; margin:24px 0; border:1px solid var(--line); }
.article-body{ font-size:1.05rem; line-height:1.7; }
.article-body p{ margin:0 0 1.2em; }
.article-body h2,.article-body h3{ font-family:var(--serif); font-weight:600; margin:1.6em 0 .6em; }
.article-body blockquote{ margin:1.4em 0; padding:.2em 0 .2em 1.2em; border-left:2px solid var(--rust); opacity:.85; }
.article-body img{ max-width:100%; height:auto; }

/* footer */
footer{ background:var(--charcoal); color:#c9bea0; margin-top:64px; padding:44px 0 30px; }
.foot-grid{ display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; font-size:.85rem; }
.foot-grid h3{ font-family:var(--serif); color:var(--sand); font-weight:600; font-size:1.05rem; margin:0 0 10px; }
.foot-cats{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:6px; }
.foot-cats a{ text-decoration:none; color:#a89a78; }
.foot-cats a:hover{ color:var(--sand); }
.copy{ font-family:var(--mono); font-size:.72rem; opacity:.55; margin-top:30px; }

@media (max-width:820px){
  .hero-grid{ grid-template-columns:1fr; }
  .row{ grid-template-columns:1fr; gap:8px; }
}