/*
Theme Name: Echo Ink Press
Theme URI: https://echoinkbooks.com/blog/
Author: Echo Ink Books
Description: A warm, polished WordPress blog theme designed to match the Echo Ink Books website pages and The Growing Reader visual system.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: echo-ink-press
*/

:root{
  --ink:#16324f;
  --ink-soft:#274766;
  --cream:#fff7ea;
  --white:#ffffff;
  --sky:#dceffc;
  --sky-deep:#b9ddf2;
  --gold:#f6c44f;
  --coral:#e9785b;
  --leaf:#a8cfa2;
  --leaf-soft:#eaf5e7;
  --gold-soft:#fff1c7;
  --line:#e8dcc8;
  --muted:#647381;
  --shadow:0 14px 34px rgba(22,50,79,.07);
  --max:1200px;
}
*,*:before,*:after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"Nunito Sans",Arial,sans-serif;
  line-height:1.6;
  overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
p,h1,h2,h3,h4{margin-top:0}
h1,h2,h3,h4,.site-title,.wp-block-heading{
  font-family:"Fraunces",Georgia,serif;
  letter-spacing:-.035em;
  line-height:1.12;
}
.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;
}
.container{width:min(var(--max),calc(100% - 3rem));margin-inline:auto}
.button,.wp-block-button__link,.nav-button{
  min-height:53px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.8rem 1.5rem;
  border-radius:999px;
  font-weight:800;
  border:none;
  cursor:pointer;
  transition:transform .18s ease,opacity .18s ease,box-shadow .18s ease;
}
.button:hover,.wp-block-button__link:hover,.nav-button:hover{transform:translateY(-2px);opacity:.94;box-shadow:0 10px 20px rgba(22,50,79,.08)}
.button-primary,.wp-block-button__link{background:var(--gold);color:var(--ink)}
.button-secondary{background:transparent;border:2px solid var(--ink);color:var(--ink)}
.button-light{background:transparent;border:2px solid rgba(255,247,234,.65);color:var(--cream)}
.actions{display:flex;flex-wrap:wrap;gap:.9rem}

/* Header */
.site-header{
  min-height:95px;
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(255,247,234,.97);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(10px);
}
.header-inner{min-height:95px;display:flex;align-items:center;gap:2rem}
.site-branding{display:flex;align-items:center;gap:.85rem;min-width:0}
.custom-logo-link img,.fallback-logo{width:80px;height:auto}
.fallback-logo{display:block}
.site-title{font-size:1.2rem;font-weight:700;margin:0;color:var(--ink)}
.site-description{margin:.1rem 0 0;color:var(--muted);font-size:.86rem}
.primary-nav{display:flex;align-items:center;gap:1.45rem;margin-left:auto;font-weight:700}
.primary-nav ul{list-style:none;display:flex;align-items:center;gap:1.45rem;margin:0;padding:0}
.primary-nav a{color:var(--ink);opacity:.94}
.primary-nav a:hover,.primary-nav .current-menu-item>a,.primary-nav .current_page_item>a{color:var(--coral);opacity:1}
.header-button{margin-left:.4rem;background:var(--gold);color:var(--ink)}
.menu-toggle{display:none;margin-left:auto;background:var(--ink);color:var(--cream);border:0;border-radius:999px;padding:.65rem 1rem;font-weight:800}

/* Hero */
.blog-hero,.archive-hero,.page-hero{
  background:var(--sky);
  padding:4.7rem 0;
  position:relative;
  overflow:hidden;
}
.blog-hero:before,.blog-hero:after,.archive-hero:before,.archive-hero:after,.page-hero:before,.page-hero:after{
  content:"";
  position:absolute;
  border:5px solid rgba(185,221,242,.82);
  border-radius:50%;
}
.blog-hero:before,.archive-hero:before,.page-hero:before{width:190px;height:190px;left:-67px;top:96px}
.blog-hero:after,.archive-hero:after,.page-hero:after{width:255px;height:255px;right:-90px;top:48px}
.hero-grid{position:relative;display:grid;grid-template-columns:1fr .72fr;gap:3.5rem;align-items:center}
.blog-hero h1,.archive-hero h1,.page-hero h1{font-size:clamp(3rem,5vw,4.45rem);margin:0 0 1.12rem}
.hero-copy>p,.archive-hero p,.page-hero p{color:var(--ink-soft);font-size:1.16rem;max-width:655px;margin-bottom:2rem}
.reader-panel{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:31px;
  padding:2.05rem 2.15rem;
  box-shadow:var(--shadow);
}
.reader-panel h2{font-size:2.12rem;margin-bottom:.35rem}
.reader-panel .sub{color:var(--ink-soft);margin-bottom:1.4rem}
.reader-line{display:flex;align-items:center;gap:1rem;padding:.72rem .9rem;border-radius:999px;margin:.7rem 0;background:var(--sky);font-weight:800}
.reader-line:nth-of-type(3){background:var(--leaf-soft)}
.reader-line:nth-of-type(4){background:var(--gold-soft)}
.reader-dot{height:40px;width:40px;display:grid;place-items:center;border-radius:50%;background:var(--gold);font-size:1.2rem}
.reader-line:nth-of-type(3) .reader-dot{background:var(--leaf)}
.reader-line:nth-of-type(4) .reader-dot{background:var(--coral);color:var(--white)}

/* Sections */
.section{padding:4.45rem 0}
.section-head{max-width:780px;margin-bottom:2.45rem}
.section-head.center{text-align:center;margin-inline:auto}
.section-head h2{font-size:clamp(2.15rem,4vw,2.95rem);margin-bottom:.72rem}
.section-head p{font-size:1.05rem;color:var(--ink-soft)}
.section-label,.tag{
  display:inline-flex;
  padding:.34rem .65rem;
  border-radius:999px;
  background:var(--sky);
  font-size:.73rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--ink);
  margin-bottom:.9rem;
}

/* Category filters */
.topics{padding:3.1rem 0 2.2rem}
.topics h2{font-size:clamp(1.95rem,3vw,2.5rem);margin-bottom:1.35rem}
.topic-filters{display:flex;flex-wrap:wrap;gap:.65rem}
.filter{border:1px solid var(--line);background:var(--white);border-radius:999px;padding:.55rem 1rem;font-weight:800;font-size:.9rem}
.filter.selected,.filter:hover{background:var(--ink);color:var(--white);border-color:var(--ink)}
.filter-count{opacity:.72;font-weight:900;margin-left:.22rem}

/* Featured */
.featured{padding:1rem 0 4.6rem}
.featured h2{font-size:clamp(2.1rem,3.8vw,2.85rem);margin-bottom:1.6rem}
.featured-grid{display:grid;grid-template-columns:1.1fr .65fr;gap:1.5rem}
.main-article,.post-card,.content-card{
  border:1px solid var(--line);
  border-radius:29px;
  overflow:hidden;
  background:var(--white);
  box-shadow:var(--shadow);
}
.article-visual,.post-image{
  height:247px;
  background:linear-gradient(140deg,var(--sky),var(--gold-soft));
  position:relative;
  overflow:hidden;
}
.article-visual img,.post-image img{width:100%;height:100%;object-fit:cover}
.article-visual:not(.has-image):after,.post-image:not(.has-image):after{
  content:"";
  position:absolute;
  right:60px;
  top:44px;
  width:125px;
  height:125px;
  border-radius:50%;
  border:5px solid rgba(255,255,255,.7);
  box-shadow:0 0 0 27px rgba(255,255,255,.36),0 0 0 53px rgba(255,255,255,.18);
}
.article-visual .page,.post-image .page{
  position:absolute;
  left:52px;
  bottom:49px;
  width:100px;
  height:112px;
  border-radius:9px;
  background:var(--cream);
  border:2px solid var(--ink);
}
.article-visual .page:after,.post-image .page:after{content:"";position:absolute;left:48px;top:10px;bottom:10px;width:2px;background:var(--ink)}
.article-body,.post-content{padding:1.65rem 1.85rem 1.75rem}
.article-body h3{font-size:clamp(1.7rem,3vw,2rem);margin-bottom:.6rem}
.article-body p,.post-content p{color:var(--ink-soft);margin-bottom:1.2rem}
.read-link{font-weight:800;color:var(--ink);display:inline-flex;gap:.4rem;align-items:center}
.read-link:hover{color:var(--coral)}
.focus{border-radius:29px;background:var(--ink);color:var(--cream);padding:2.1rem;display:flex;flex-direction:column;justify-content:center}
.focus h3{color:var(--cream);font-size:1.8rem;margin-bottom:.8rem}
.focus p{opacity:.94;margin-bottom:1.65rem}
.focus .button-primary{align-self:flex-start;margin-bottom:.8rem}
.focus .button-light{align-self:flex-start}

/* Posts grid */
.latest{background:var(--cream);padding-top:0}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.post-card{border-radius:25px;box-shadow:0 8px 22px rgba(22,50,79,.04)}
.post-card .post-image{height:142px;background:var(--sky)}
.post-card:nth-child(2) .post-image{background:var(--leaf-soft)}
.post-card:nth-child(3) .post-image{background:var(--gold-soft)}
.post-card .post-content{padding:1.45rem}
.post-card h3{font-size:1.48rem;margin-bottom:.54rem}
.post-card p{font-size:.93rem}
.empty-state{background:var(--white);border:1px solid var(--line);border-radius:25px;padding:2rem;box-shadow:0 8px 22px rgba(22,50,79,.04)}
.empty-state p{color:var(--ink-soft);margin:.5rem 0 1.2rem}

/* Kobi / CTA bands */
.kobi-band{padding:0 0 4.35rem}
.kobi-box{display:grid;grid-template-columns:1fr 410px;gap:2rem;align-items:center;background:var(--sky);border-radius:32px;padding:2.6rem 3rem}
.kobi-copy h2{font-size:clamp(2.15rem,4vw,2.8rem);margin-bottom:.7rem}
.kobi-copy p{font-size:1.04rem;color:var(--ink-soft);max-width:600px;margin-bottom:1.6rem}
.kobi-visual{display:flex;justify-content:end;align-items:center;gap:1.15rem}
.kobi-visual img{width:126px;background:var(--white);padding:6px;border-radius:12px;box-shadow:var(--shadow)}
.app-tile{width:113px;height:165px;background:var(--white);border:1px solid var(--line);border-radius:18px;display:grid;place-items:center;text-align:center;font-weight:800}
.app-tile span{display:block;font-family:"Fraunces",Georgia,serif;font-size:1.5rem}

/* Popular topics */
.popular{background:var(--white)}
.popular-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
.popular-card{border:1px solid var(--line);border-radius:25px;background:var(--cream);display:grid;grid-template-columns:58px 1fr;gap:1.05rem;padding:1.5rem}
.pop-icon{height:57px;width:57px;border-radius:50%;background:var(--gold);display:grid;place-items:center;font-weight:800}
.popular-card:nth-child(2) .pop-icon{background:var(--sky)}
.popular-card:nth-child(3) .pop-icon{background:var(--leaf)}
.popular-card:nth-child(4) .pop-icon{background:var(--coral);color:#fff}
.popular-card h3{font-size:1.45rem;margin-bottom:.38rem}
.popular-card p{color:var(--ink-soft);font-size:.94rem;margin:0}

/* Single/Page content */
.content-wrap{padding:4.5rem 0}
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:2rem;align-items:start}
.article-shell,.page-shell{background:var(--white);border:1px solid var(--line);border-radius:29px;box-shadow:var(--shadow);overflow:hidden}
.single-featured-image{height:min(460px,55vw);background:var(--sky);overflow:hidden}
.single-featured-image img{width:100%;height:100%;object-fit:cover}
.article-inner,.page-inner{padding:clamp(1.5rem,4vw,3rem)}
.entry-meta{display:flex;flex-wrap:wrap;gap:.55rem 1rem;color:var(--muted);font-size:.92rem;margin-bottom:1rem;font-weight:700}
.entry-title{font-size:clamp(2.4rem,5vw,4rem);margin:0 0 1rem}
.entry-content{font-size:1.08rem;color:var(--ink-soft)}
.entry-content h2,.entry-content h3{color:var(--ink);margin-top:2rem}
.entry-content a{text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--gold);text-underline-offset:3px;font-weight:800}
.entry-content img{border-radius:18px}
.entry-content blockquote{margin:2rem 0;padding:1.2rem 1.5rem;border-left:5px solid var(--gold);background:var(--gold-soft);border-radius:0 18px 18px 0;color:var(--ink)}
.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem}
.post-nav a{background:var(--white);border:1px solid var(--line);border-radius:18px;padding:1rem;font-weight:800;box-shadow:0 8px 22px rgba(22,50,79,.04)}
.post-nav .nav-next{text-align:right}

/* Sidebar */
.sidebar{display:grid;gap:1rem}
.widget,.sidebar-card{background:var(--white);border:1px solid var(--line);border-radius:25px;padding:1.4rem;box-shadow:0 8px 22px rgba(22,50,79,.04)}
.widget h2,.widget h3,.sidebar-card h3{font-size:1.35rem;margin-bottom:.8rem}
.widget ul{margin:0;padding-left:1.1rem}
.widget li{margin:.35rem 0}
.wp-block-search__inside-wrapper{display:flex;gap:.5rem;flex-wrap:wrap}
.wp-block-search__input,.search-field{min-height:44px;border:1px solid var(--line);border-radius:999px;padding:0 1rem;font:inherit;background:var(--cream);flex:1}
.wp-block-search__button,.search-submit{min-height:44px;border:0;border-radius:999px;background:var(--gold);color:var(--ink);padding:0 1rem;font-weight:800}

/* Signup */
.signup{padding:4rem 0;background:var(--ink);color:var(--cream)}
.signup-grid{display:grid;grid-template-columns:1fr .86fr;gap:3rem;align-items:center}
.signup h2{color:var(--cream);font-size:clamp(2.15rem,4vw,2.85rem);margin-bottom:.7rem}
.signup p{opacity:.94;max-width:610px}
.signup-form{display:flex;gap:.72rem}
.signup-form input{flex:1;min-height:54px;border:0;border-radius:999px;padding:0 1.1rem;font:inherit}

/* Pagination */
.pagination{display:flex;justify-content:center;gap:.5rem;margin:2.5rem 0 0;flex-wrap:wrap}
.pagination .page-numbers{min-width:42px;min-height:42px;display:grid;place-items:center;border-radius:999px;border:1px solid var(--line);background:var(--white);font-weight:800}
.pagination .current{background:var(--ink);color:var(--white);border-color:var(--ink)}

/* Footer */
.site-footer{background:var(--ink);color:var(--cream);padding:2.5rem 0 1.35rem;border-top:1px solid rgba(255,255,255,.16)}
.footer-top{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.footer-brand img,.footer-logo{width:174px;background:var(--cream);padding:4px;border-radius:9px;margin-bottom:.52rem}
.footer-brand p{margin:0;opacity:.9}
.footer-nav{display:flex;flex-wrap:wrap;gap:1.15rem;font-weight:700}
.footer-nav a:hover{color:var(--gold)}
.copyright{margin-top:1.9rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.16);font-size:.86rem;opacity:.8}

/* WordPress alignment */
.alignwide{max-width:var(--max);margin-left:auto;margin-right:auto}
.alignfull{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);max-width:100vw;width:100vw}
.wp-caption{max-width:100%}
.wp-caption-text{font-size:.9rem;color:var(--muted);margin:.4rem 0 0}
.gallery{display:grid;gap:1rem}
.sticky .post-content:before{content:"Featured";display:inline-flex;padding:.25rem .6rem;border-radius:999px;background:var(--gold);font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.7rem}

@media(max-width:1000px){
  .primary-nav{display:none;position:absolute;left:1rem;right:1rem;top:86px;background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:24px;padding:1rem;flex-direction:column;align-items:flex-start;z-index:30}
  .primary-nav.is-open{display:flex}
  .primary-nav ul{display:grid;gap:.75rem;width:100%}
  .menu-toggle{display:inline-flex}
  .header-button{display:none}
  .hero-grid,.featured-grid,.kobi-box,.signup-grid,.content-grid{grid-template-columns:1fr}
  .post-grid{grid-template-columns:1fr}
  .kobi-visual{justify-content:start}
}
@media(max-width:680px){
  .container{width:calc(100% - 2rem)}
  .site-header,.header-inner{min-height:80px}
  .custom-logo-link img,.fallback-logo{width:66px}
  .blog-hero,.archive-hero,.page-hero{padding:3.2rem 0}
  .actions,.signup-form{display:grid}
  .popular-grid{grid-template-columns:1fr}
  .popular-card{grid-template-columns:1fr}
  .kobi-box{padding:2rem 1.3rem}
  .kobi-visual img{width:95px}
  .app-tile{width:95px;height:132px}
  .footer-top{display:block}
  .footer-nav{margin-top:1.25rem}
  .post-nav{grid-template-columns:1fr}
  .post-nav .nav-next{text-align:left}
}

/* Small WordPress menu output adjustments */
.logo img{width:80px;height:auto}
.footer-nav ul,.footer-menu{list-style:none;display:flex;flex-wrap:wrap;gap:1.15rem;margin:0;padding:0}
.primary-menu{list-style:none}
.search-form{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.search-form label{flex:1;min-width:220px}
.content-grid .post-grid{grid-template-columns:repeat(2,1fr)}
@media(max-width:680px){.content-grid .post-grid{grid-template-columns:1fr}.logo img{width:66px}}


/* Compact overlay cards for blog home */
.compact-featured{padding:1rem 0 3.2rem}
.compact-featured h2{margin-bottom:1.15rem}
.compact-featured .featured-grid{grid-template-columns:1.2fr .55fr;align-items:stretch}
.article-card-overlay{background:transparent}
.article-card-overlay .article-visual,
.article-card-overlay .post-image{
  display:block;
  border-radius:29px;
  overflow:hidden;
  isolation:isolate;
}
.article-card-overlay .article-visual{height:330px}
.article-card-overlay .post-image{height:230px;background:linear-gradient(140deg,var(--sky),var(--gold-soft))}
.image-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(22,50,79,.08) 0%,rgba(22,50,79,.34) 38%,rgba(22,50,79,.88) 100%);
}
.article-overlay-content{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  gap:.44rem;
  padding:1.45rem;
  color:var(--white);
}
.main-article .article-overlay-content{padding:1.75rem 1.9rem}
.overlay-tag{
  width:fit-content;
  margin:0;
  background:rgba(255,247,234,.94);
  color:var(--ink);
}
.overlay-title{
  display:block;
  max-width:880px;
  color:var(--white);
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(1.75rem,3vw,2.48rem);
  font-weight:700;
  letter-spacing:-.035em;
  line-height:1.08;
  text-shadow:0 2px 18px rgba(0,0,0,.25);
}
.post-card .overlay-title{font-size:clamp(1.2rem,2vw,1.48rem)}
.overlay-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.38rem;
  align-items:center;
  font-size:.88rem;
  font-weight:800;
  color:rgba(255,255,255,.88);
}
.meta-separator{opacity:.75}
.compact-focus{
  min-height:330px;
  padding:1.65rem;
  border-radius:29px;
}
.compact-focus h3{font-size:1.55rem}
.compact-focus p{font-size:.96rem;margin-bottom:1.15rem}
.compact-focus .button{min-height:46px;padding:.62rem 1.1rem}
.compact-latest{padding-top:0;padding-bottom:3.4rem}
.compact-section-head{margin-bottom:1.55rem}
.overlay-post-grid{gap:1rem}
.overlay-post-grid .post-card{border:0;box-shadow:0 8px 22px rgba(22,50,79,.06)}
.overlay-post-grid .post-card:nth-child(2) .post-image{background:var(--leaf-soft)}
.overlay-post-grid .post-card:nth-child(3) .post-image{background:var(--gold-soft)}
.overlay-post-grid .post-card:nth-child(4) .post-image{background:var(--sky)}
.overlay-post-grid .post-card:nth-child(5) .post-image{background:var(--leaf-soft)}
.overlay-post-grid .post-card:nth-child(6) .post-image{background:var(--gold-soft)}
.article-card-overlay .post-image:not(.has-image) .page,
.article-card-overlay .article-visual:not(.has-image) .page{z-index:0}
.article-card-overlay .post-image:not(.has-image):after,
.article-card-overlay .article-visual:not(.has-image):after{z-index:0}

@media(max-width:1000px){
  .compact-featured .featured-grid{grid-template-columns:1fr}
  .article-card-overlay .article-visual{height:300px}
  .compact-focus{min-height:auto}
}
@media(max-width:680px){
  .article-card-overlay .article-visual{height:280px}
  .article-card-overlay .post-image{height:220px}
  .main-article .article-overlay-content,
  .article-overlay-content{padding:1.15rem}
  .overlay-title{font-size:1.62rem}
  .post-card .overlay-title{font-size:1.24rem}
}