/*
Theme Name: Zamrik
Theme URI: https://zamrik.com
Author: Dr. T. Zamrik
Description: Bespoke hand-coded theme for zamrik.com. Replaces Divi entirely. Applied mathematics & quantitative finance — navy→teal identity, Cormorant Garamond + Proza Libre, KaTeX-friendly. Zero page-builder.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: zamrik
*/

/* ============================================================
   Design tokens — the zamrik identity (from the old Divi look)
   ============================================================ */
:root{
  --grad: linear-gradient(135deg,#0d1f3c 0%,#1e3a5f 40%,#1a7080 72%,#2a9d8f 100%);
  --navy:#1e3a5f;
  --navy-deep:#0d1f3c;
  --teal:#2a9d8f;
  --teal-deep:#1a7080;
  --accent:#023047;
  --accent2:#219ebc;
  --ink:#3c3a47;
  --muted:#888;
  --line:#e8e8e8;
  --bg:#ffffff;
  --maxw:1180px;
  --readw:860px;
  --body-font:"Proza Libre",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --head-font:"Cormorant Garamond",Georgia,serif;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--body-font);
  color:var(--ink);
  background:var(--bg);
  line-height:1.7;
  font-size:18px;
}
img{max-width:100%;height:auto;}
a{color:var(--teal-deep);text-decoration:none;}
a:hover{color:var(--teal);}
h1,h2,h3,h4{font-family:var(--head-font);color:var(--navy);line-height:1.2;font-weight:600;}
h1{font-size:2.6rem;margin:.2em 0 .3em;}
h2{font-size:1.9rem;}
h3{font-size:1.45rem;}
.container{max-width:var(--maxw);margin:0 auto;padding:0 1.5rem;}
.readable{max-width:var(--readw);margin:0 auto;padding:0 1.5rem;}

/* ============================================================
   Header — gradient chrome, title left, menu right
   ============================================================ */
.site-header{background:var(--grad);color:#fff;}
.site-header a{color:#fff;}
.header-inner{
  max-width:var(--maxw);margin:0 auto;padding:1.1rem 1.5rem;
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;
}
.site-branding .site-logo{display:block;line-height:0;}
.site-branding .site-logo img{display:block;width:120px;max-width:40vw;height:auto;}
.site-branding .site-title{
  font-family:var(--head-font);font-size:1.9rem;font-weight:700;margin:0;color:#fff;line-height:1;
}
.site-branding .site-title a{color:#fff;}
.site-branding .site-tagline{
  font-size:.82rem;letter-spacing:.03em;opacity:.85;margin:.25rem 0 0;font-family:var(--body-font);
}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:1.4rem;flex-wrap:wrap;align-items:center;}
.main-nav li{position:relative;}
.main-nav a{font-size:.95rem;font-weight:500;padding:.4rem 0;display:inline-block;opacity:.95;}
.main-nav a:hover{opacity:1;border-bottom:2px solid var(--teal);}
.main-nav .sub-menu{
  display:none;position:absolute;top:100%;left:0;background:#0d1f3c;min-width:210px;
  padding:.5rem 0;border-radius:0 0 6px 6px;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:50;
}
.main-nav li:hover>.sub-menu{display:block;}
.main-nav .sub-menu li{display:block;}
.main-nav .sub-menu a{display:block;padding:.5rem 1.1rem;font-size:.9rem;opacity:.9;}
.main-nav .sub-menu a:hover{background:rgba(255,255,255,.08);border-bottom:none;opacity:1;}
.header-utility{display:flex;align-items:center;gap:1rem;font-size:.9rem;}
.header-utility a{opacity:.9;}
.header-social a{margin-left:.6rem;font-size:1rem;}

/* ============================================================
   Footer — gradient, white text, menu + widgets
   ============================================================ */
.site-footer{background:var(--grad);color:#fff;margin-top:4rem;border-top:2px solid rgba(0,0,0,.08);}
.site-footer a{color:#fff;opacity:.9;}
.site-footer a:hover{opacity:1;text-decoration:underline;}
.footer-inner{
  max-width:var(--maxw);margin:0 auto;padding:2.6rem 1.5rem 1.4rem;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;
}
.footer-inner h4{color:#fff;font-size:1.15rem;margin:0 0 .8rem;}
.footer-widget ul{list-style:none;margin:0;padding:0;}
.footer-widget li{margin:.35rem 0;font-size:.92rem;}
.footer-menu ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem;}
/* Dark-blue bottom bar: social left · contact email · logo right */
.zamrik-footer-bar{
  background:#0a1828;border-top:1px solid rgba(255,255,255,.08);
  padding:.9em 2em;display:flex;align-items:center;gap:.9em;flex-wrap:wrap;
}
.zamrik-footer-social{display:flex;gap:1em;align-items:center;}
.zamrik-footer-social a{
  display:flex;align-items:center;justify-content:center;width:2em;height:2em;
  border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  transition:background .2s,border-color .2s;
}
.zamrik-footer-social a:hover{background:rgba(42,157,143,.3);border-color:var(--teal);}
.zamrik-footer-social svg{fill:#c8e8e4;width:1em;height:1em;display:block;}
.zamrik-footer-social a:hover svg{fill:#fff;}
.zamrik-footer-contact{color:#7dd3fc;font-size:.88em;margin-left:1.4em;}
.zamrik-footer-contact a{color:#7dd3fc;text-decoration:none;}
.zamrik-footer-contact a:hover{color:#fff;}
.zamrik-footer-logo{display:block;flex-shrink:0;margin-left:auto;line-height:0;}
.zamrik-footer-logo img{display:block;width:120px;max-width:40vw;height:auto;object-fit:contain;}

/* ============================================================
   Front page — hero + the three pieces
   ============================================================ */
.home-hero{padding:3rem 1.5rem 1rem;max-width:var(--readw);margin:0 auto;}
.home-hero h1{font-size:3rem;color:var(--navy);margin-bottom:.15em;}
.home-hero .lede{font-size:1.2rem;color:#555;margin:0 0 1.5rem;}
.home-piece{
  max-width:var(--readw);margin:0 auto;padding:2.2rem 1.5rem;border-top:1px solid var(--line);
}
.home-piece h2{margin-top:0;}
.home-piece p{color:#333;}
/* Split section: text left, watercolor art right (original home layout) */
.home-piece--split{display:flex;align-items:flex-start;gap:2.5em;flex-wrap:wrap;}
.home-piece--split .home-piece-text{flex:1;min-width:240px;}
.home-piece--split .home-piece-art{flex:0 0 400px;}
.home-piece--split .home-piece-art img{
  width:400px;max-width:100%;height:800px;object-fit:cover;border-radius:4px;display:block;
}
@media (max-width:820px){
  .home-piece--split .home-piece-art{flex:1 1 100%;}
  .home-piece--split .home-piece-art img{width:100%;height:auto;}
}

/* ============================================================
   Blog list (ported from blog-layout.php, Divi-free)
   ============================================================ */
.zam-blog-wrap{max-width:var(--readw);margin:0 auto;padding:2.5rem 1.5rem 4rem;}
.zam-blog-controls{display:flex;align-items:center;justify-content:space-between;gap:1em;margin-bottom:1.6em;flex-wrap:wrap;}
.zam-search-form{display:flex;align-items:center;border:1px solid #ccc;border-radius:4px;overflow:hidden;flex:1;min-width:180px;max-width:320px;}
.zam-search-input{border:none;outline:none;padding:.5em .8em;font-size:.9em;width:100%;color:#000;background:#fff;}
.zam-search-btn{background:var(--navy);border:none;color:#fff;padding:.5em .9em;cursor:pointer;font-size:.95em;line-height:1;}
.zam-search-btn:hover{background:var(--teal);}
.zam-sort-wrap{display:flex;align-items:center;gap:.4em;font-size:.88em;color:#444;white-space:nowrap;}
.zam-sort-select{border:1px solid #ccc;border-radius:4px;padding:.4em .6em;font-size:.88em;cursor:pointer;color:#000;background:#fff;}
.zam-cat-bar{display:flex;flex-wrap:wrap;gap:.5em;margin-bottom:2em;}
.zam-cat-btn{display:inline-block;padding:.35em .9em;border-radius:20px;border:1px solid var(--teal-deep);color:var(--teal-deep);font-size:.82em;font-weight:600;transition:all .15s;white-space:nowrap;}
.zam-cat-btn:hover,.zam-cat-btn.active{background:var(--teal-deep);color:#fff;}
.zam-cat-btn.all-btn{border-color:var(--navy);color:var(--navy);}
.zam-cat-btn.all-btn:hover,.zam-cat-btn.all-btn.active{background:var(--navy);color:#fff;}
.zam-post-list{border-top:2px solid #e0e0e0;}
.zam-post-item{padding:1.4em 0;border-bottom:1px solid var(--line);}
.zam-post-meta{font-size:.8em;color:var(--muted);margin-bottom:.35em;display:flex;align-items:center;gap:.5em;flex-wrap:wrap;}
.zam-post-cat-tag{display:inline-block;background:#f0f4f8;color:var(--navy);border-radius:3px;padding:.1em .5em;font-size:.9em;font-weight:600;}
.zam-post-cat-tag:hover{background:var(--navy);color:#fff;}
.zam-post-title{margin:0 0 .4em;font-size:1.25em;line-height:1.3;}
.zam-post-title a{color:var(--teal-deep);font-weight:700;}
.zam-post-title a:hover{color:var(--teal);}
.zam-post-excerpt{font-size:.93em;color:#333;margin:0 0 .6em;line-height:1.6;}
.zam-read-more{font-size:.85em;color:var(--teal);font-weight:600;}
.zam-read-more:hover{color:var(--navy);}
.zam-pagination{display:flex;align-items:center;justify-content:center;gap:.4em;margin-top:2.5em;flex-wrap:wrap;}
.zam-page-btn{display:inline-flex;align-items:center;justify-content:center;min-width:2.2em;height:2.2em;border:1px solid #ccc;border-radius:4px;color:#333;font-size:.9em;padding:0 .5em;transition:all .15s;background:#fff;}
.zam-page-btn:hover{border-color:var(--teal-deep);color:var(--teal-deep);}
.zam-page-btn.current{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:700;}
.zam-page-btn.disabled{color:#ccc;border-color:#e0e0e0;pointer-events:none;}

/* ============================================================
   Single article + pages
   ============================================================ */
.article-header{max-width:var(--readw);margin:0 auto;padding:2.5rem 1.5rem 1rem;}
.article-header h1{font-size:2.4rem;}
.article-meta{color:var(--muted);font-size:.9rem;margin-top:.5rem;}
.entry-content{max-width:var(--readw);margin:0 auto;padding:1rem 1.5rem 2rem;}
.entry-content p{margin:0 0 1.2em;}
.entry-content figure{margin:2em 0;}
.entry-content figcaption{text-align:center;font-size:.9em;color:#444;margin-top:.5em;}
.entry-content h2,.entry-content h3{margin-top:1.6em;}
.entry-content img{border-radius:4px;}
.katex-display{overflow-x:auto;overflow-y:hidden;padding:.3em 0;}
.post-nav{max-width:var(--readw);margin:2rem auto 0;padding:1.5rem;display:flex;justify-content:space-between;gap:1rem;border-top:1px solid var(--line);font-size:.9rem;}

/* Research archive (numbered list from research-cpt.php lives in mu-plugin;
   this styles the generic fallback) */
.archive-header{max-width:var(--readw);margin:0 auto;padding:2.5rem 1.5rem 1rem;}
.archive-header h1{font-size:2.2rem;}

/* ============================================================
   Content styling — ported from fix-viewport.php, re-scoped
   from Divi's .et_pb_post_content to .entry-content. Governs
   blog posts + research articles (code/algo boxes, eq-row,
   figures, headings, CTA, currency guard).
   ============================================================ */
.entry-content h1.post-inner-title{color:#2a9d8f;font-size:2.2em;font-weight:700;line-height:1.25;margin-bottom:1.8em;font-family:var(--head-font);}
.entry-content h2{margin-top:2.8em;margin-bottom:.8em;border-top:1px solid #e0e0e0;padding-top:1em;}
.entry-content hr + h2,
.entry-content hr + section.level2 > h2{border-top:none !important;padding-top:0 !important;}
.entry-content h3{margin-top:3em;margin-bottom:.4em;border-top:1px solid #e8e8e8;padding-top:.6em;}
.entry-content h2 + h3{border-top:none;padding-top:0;margin-top:1.2em;}
.entry-content figure{margin-bottom:3em;}
.entry-content figcaption{margin-top:.5em;margin-bottom:0;font-size:.88em;color:#555;line-height:1.5;}
.entry-content section.level2{margin-top:2.8em;}
.entry-content section.level3{margin-top:3em !important;padding-top:0 !important;}
.entry-content section.level2 > h2{margin-top:0;}
.entry-content section.level3 > h3{margin-top:0;border-top:1px solid #e8e8e8;padding-top:.6em;}
.entry-content p{margin-bottom:1.1em;line-height:1.85;}
.entry-content .research-algo,.entry-content .research-code{margin:1.8em 0;}
.entry-content hr{margin:2.8em 0 1.4em;}

/* CTA links — red + bold */
.cta-link,.cta-link:visited{color:#cc0000 !important;font-weight:700 !important;text-decoration:none;}
.cta-link:hover{color:#990000 !important;}

/* Code box (green) */
.research-code-title{background:#0d0d0d !important;color:#39ff14 !important;font-family:"JetBrains Mono","Courier New",Courier,monospace;font-size:.78em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.4em 1.2em;border-bottom:1px solid #1a3313;user-select:none;margin:0;}
.research-code{background:#1a1a1a;border:1px solid #333;border-left:4px solid #39ff14;border-radius:4px;overflow-x:auto;margin:1.4em 0;}
.research-code pre{margin:0;padding:1em 1.2em;font-family:"JetBrains Mono","Courier New",Courier,monospace;font-weight:700;font-size:1.05em;line-height:1.65;color:#39ff14;white-space:pre;overflow-x:auto;}

/* Algorithm box (cyan) */
.research-algo{background:#1a1a1a;border:1px solid #333;border-left:4px solid #00e5ff;border-radius:4px;overflow-x:auto;margin:1.4em 0;}
.research-algo-title{background:#0d0d0d;color:#00e5ff;font-family:"JetBrains Mono","Courier New",Courier,monospace;font-size:.78em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.4em 1.2em;border-bottom:1px solid #1a3333;user-select:none;}
.research-algo pre{margin:0;padding:1em 1.2em;font-family:"JetBrains Mono","Courier New",Courier,monospace;font-weight:700;font-size:1.05em;line-height:1.65;color:#00e5ff;white-space:pre;overflow-x:auto;-webkit-overflow-scrolling:touch;}

/* Numbered equation rows */
.eq-row{display:grid;grid-template-columns:4em 1fr 4em;align-items:center;margin:1.6em 0;overflow-x:auto;}
.eq-row > div{grid-column:2;text-align:center;}
.eq-num{grid-column:3;text-align:right;padding-left:1em;}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:820px){
  .header-inner{flex-direction:column;align-items:flex-start;}
  .main-nav ul{gap:1rem;}
  h1{font-size:2.1rem;}
  .home-hero h1{font-size:2.3rem;}
}
@media (max-width:600px){
  .zam-blog-controls{flex-direction:column;align-items:flex-start;}
  .zam-search-form{max-width:100%;}
}
/* Mobile: wide code blocks & display equations scroll INSIDE their own box
   (they carry overflow-x:auto); the PAGE itself must never scroll sideways, or
   the gradient header/footer bars stop at the viewport edge and leave a white
   strip on the right when you scroll. Clip page-level horizontal overflow so the
   bars always span the full width. (The header is not sticky, so this is safe.) */
@media (max-width:980px){
  html,body{overflow-x:hidden;max-width:100%;}
  .eq-row>div{min-width:0;}
  .entry-content{overflow-wrap:break-word;}
}
