/*
Theme Name: Smart Reads Hub
Theme URI: https://example.com/
Author: Smart Reads Hub
Description: A bold, mobile-first blog and ebook storefront theme. Pair it with the Smart Reads Hub Core plugin for the Ebooks post type, sales pages, Selar buy buttons and Elementor widgets. The homepage is an ordinary page, fully editable in Elementor.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: smart-reads-hub
Tags: blog, e-commerce, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, full-width-template
*/

:root{
  --ink:#0e1a2b; --ink2:#1c2d48; --sun:#f6a821; --sun-d:#e08e0b; --cream:#fbf6ea; --paper:#fffdf8;
  --leaf:#1d7a5f; --line:#e8dfcb; --muted:#5b667a;
  --head:'Bricolage Grotesque',Georgia,serif; --body:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.7 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--leaf)}
a:hover{color:var(--ink)}
h1,h2,h3,h4{font-family:var(--head);line-height:1.12;letter-spacing:-.02em;color:var(--ink)}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:-9999px;top:8px;background:var(--ink);color:#fff;padding:10px 16px;z-index:999;border-radius:8px}
.skip-link:focus{left:8px}
.sr-wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 20px}
.sr-narrow{max-width:760px}
.sr-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 22px;border-radius:999px;background:var(--sun);color:var(--ink);font:700 15px/1.1 var(--body);text-decoration:none;border:2px solid transparent;transition:transform .15s ease,background .15s ease}
.sr-btn:hover{background:var(--sun-d);color:var(--ink);transform:translateY(-2px)}

/* Header */
.sr-header{position:sticky;top:0;z-index:100;background:rgba(255,253,248,.94);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.admin-bar .sr-header{top:32px}
.sr-header__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.sr-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font:800 20px/1 var(--head);letter-spacing:-.02em}
.sr-brand svg{width:30px;height:30px;flex:none}
.sr-brand img{max-height:42px;width:auto}
.sr-nav{display:none}
.sr-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:6px;align-items:center}
.sr-nav a{display:block;padding:9px 14px;border-radius:999px;color:var(--ink);text-decoration:none;font:600 15px/1 var(--body)}
.sr-nav a:hover,.sr-nav .current-menu-item>a,.sr-nav .current-menu-ancestor>a,.sr-nav .is-current>a{background:var(--cream);color:var(--ink)}
.sr-header__cta{display:none}
.sr-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:0 11px;background:transparent;border:1px solid var(--line);border-radius:12px;cursor:pointer}
.sr-toggle span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:transform .2s ease,opacity .2s ease}
.sr-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.sr-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.sr-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.sr-mobile{display:none;border-top:1px solid var(--line);background:var(--paper);padding:10px 20px 20px}
.sr-mobile.is-open{display:block}
.sr-mobile ul{list-style:none;margin:0 0 14px;padding:0}
.sr-mobile a{display:block;padding:14px 4px;color:var(--ink);text-decoration:none;font:700 18px/1.2 var(--head);border-bottom:1px solid var(--line)}
.sr-mobile .sr-btn{width:100%}

/* Page header, content */
.sr-pagehead{background:var(--cream);padding:48px 0 40px;border-bottom:1px solid var(--line)}
.sr-pagehead h1{margin:0 0 8px;font-size:clamp(34px,7vw,56px);font-weight:800}
.sr-pagehead p{margin:0;color:var(--muted);font-size:18px}
.sr-eyebrow{margin:0 0 10px;font:700 13px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--leaf)}
.sr-main{padding:44px 0 72px}
.sr-content>*{max-width:100%}
.sr-content h2{font-size:32px;margin:1.6em 0 .5em}
.sr-content h3{font-size:24px;margin:1.4em 0 .4em}
.sr-content blockquote{margin:1.6em 0;padding:6px 0 6px 22px;border-left:5px solid var(--sun);font:500 21px/1.55 var(--head)}
.sr-content img{border-radius:14px}
.sr-fullwidth{padding:0}

/* Blog cards */
.sr-grid{display:grid;gap:22px;grid-template-columns:1fr}
.sr-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;transition:transform .2s ease,box-shadow .2s ease}
.sr-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -24px rgba(14,26,43,.35)}
.sr-card__img{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--cream)}
.sr-card__img img{width:100%;height:100%;object-fit:cover;display:block}
.sr-card__body{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1}
.sr-card__meta{margin:0;font:600 12px/1 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--leaf)}
.sr-card__title{margin:0;font-size:22px}
.sr-card__title a{color:inherit;text-decoration:none}
.sr-card__title a:hover{text-decoration:underline}
.sr-card__excerpt{margin:0;color:var(--muted);font-size:15px;line-height:1.6}
.sr-more{margin-top:auto;font:700 14px/1 var(--body);text-decoration:none}
.sr-pagination{margin-top:40px;display:flex;justify-content:center}
.sr-pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px}
.sr-pagination a,.sr-pagination span{display:inline-flex;min-width:42px;height:42px;align-items:center;justify-content:center;padding:0 14px;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-weight:700;color:var(--ink)}
.sr-pagination .current{background:var(--ink);color:#fff;border-color:var(--ink)}

/* Single post */
.sr-post__meta{color:var(--muted);font-size:15px;margin:0 0 24px}
.sr-post__hero{margin:0 0 28px;border-radius:22px;overflow:hidden}
.sr-post__hero img{display:block;width:100%}
.sr-tags{margin:30px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.sr-tags a{padding:6px 14px;border-radius:999px;background:var(--cream);text-decoration:none;font-size:14px;font-weight:600;color:var(--ink)}
.sr-promo{margin-top:56px;padding:34px 22px;border-radius:26px;background:var(--ink);color:#fff}
.sr-promo h2{margin:0 0 6px;color:#fff;font-size:30px}
.sr-promo>p{margin:0 0 26px;color:rgba(255,255,255,.75)}
.sr-promo .srh-grid{--srh-cols:2;--srh-gap:20px}
.sr-promo .srh-card__title,.sr-promo .srh-card__title a{color:#fff}
.sr-promo .srh-card__desc{color:rgba(255,255,255,.72)}
.sr-promo .srh-btn--ghost{color:#fff;border-color:rgba(255,255,255,.6)}
.sr-promo .srh-btn--ghost:hover{background:var(--sun);color:var(--ink);border-color:var(--sun)}
.comments-area{margin-top:56px}
.comment-list{list-style:none;padding:0}
.comment-body{padding:18px 0;border-bottom:1px solid var(--line)}
.comment-respond input[type=text],.comment-respond input[type=email],.comment-respond input[type=url],.comment-respond textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;font:inherit}
.comment-respond input[type=submit]{padding:12px 22px;border:0;border-radius:999px;background:var(--sun);color:var(--ink);font:700 15px var(--body);cursor:pointer}

/* Search + 404 */
.sr-search{display:flex;gap:10px;max-width:520px}
.sr-search input[type=search]{flex:1;padding:13px 18px;border:2px solid var(--ink);border-radius:999px;font:inherit;background:#fff}
.sr-search button{padding:0 22px;border:0;border-radius:999px;background:var(--ink);color:#fff;font:700 15px var(--body);cursor:pointer}
.sr-404{text-align:center;padding:90px 0}
.sr-404 h1{font-size:clamp(70px,20vw,160px);margin:0;color:var(--sun)}

/* Footer */
.sr-footer{background:var(--ink);color:rgba(255,255,255,.76);padding:60px 0 28px;font-size:15px}
.sr-footer a{color:rgba(255,255,255,.86);text-decoration:none}
.sr-footer a:hover{color:var(--sun)}
.sr-footer__grid{display:grid;gap:34px;grid-template-columns:1fr}
.sr-footer .sr-brand{color:#fff}
.sr-footer h3{margin:0 0 14px;font:700 13px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--sun)}
.sr-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.sr-footer__tag{margin:14px 0 0;max-width:340px;line-height:1.6}
.sr-footer__bottom{margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:13px}

@media (min-width:640px){
  .sr-grid{grid-template-columns:repeat(2,1fr)}
  .sr-footer__grid{grid-template-columns:1.4fr 1fr 1fr}
}
@media (min-width:900px){
  .sr-wrap{padding:0 32px}
  .sr-nav{display:block}
  .sr-header__cta{display:inline-flex}
  .sr-toggle,.sr-mobile{display:none!important}
  .sr-grid{grid-template-columns:repeat(3,1fr);gap:28px}
  .sr-main{padding:64px 0 96px}
  .sr-promo{padding:44px}
  .sr-promo .srh-grid{--srh-cols:3}
}
@media (max-width:782px){.admin-bar .sr-header{top:46px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
