/*
Theme Name: Opiate Recovery
Theme URI: https://opiate-recovery.example.com
Author: Opiate.us
Description: A clean, medically-focused WordPress theme for opiate withdrawal and recovery resources. Features dark hero, topic grids, article listings, FAQ accordion, and Customizer support.
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: opiate_recovery
Tags: medical, health, blog, clean, responsive
*/

:root{
  --night:#0F1C2E;--deep:#162840;--slate:#1E3A5F;--mid:#2C5282;
  --dawn:#E8A84C;--dawn2:#C98935;--sage:#4A8C6A;--sage2:#3A7258;
  --cream:#FAF8F4;--paper:#F3F0EA;--paper2:#E8E4DC;
  --white:#FFFFFF;--ink:#1C1C2A;--muted:#6B7280;
  --border:rgba(0,0,0,.09);--bd:rgba(255,255,255,.1);
  --serif:'Lora',Georgia,serif;--sans:'DM Sans',sans-serif;--mono:'DM Mono',monospace;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--white);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto}
.container{max-width:1280px;margin:0 auto;padding:0 32px}

/* TYPOGRAPHY */
h1,h2,h3,h4,h5,h6{font-family:var(--serif);font-weight:600;line-height:1.2}
h1{font-size:clamp(28px,4vw,52px);font-weight:400;letter-spacing:-.025em}
h2{font-size:clamp(22px,3vw,38px);font-weight:500;letter-spacing:-.02em}
h3{font-size:clamp(18px,2vw,26px)}
p{margin-bottom:16px;line-height:1.8}
p:last-child{margin-bottom:0}
ul,ol{padding-left:24px;margin-bottom:16px}
li{margin-bottom:6px;line-height:1.7}
blockquote{border-left:3px solid var(--primary,var(--dawn,#E8A84C));padding:16px 20px;background:var(--cream);margin:24px 0;font-family:var(--serif);font-style:italic;font-size:16px}
.entry-content h2,.entry-content h3,.entry-content h4{margin:32px 0 12px}
.entry-content p{color:var(--muted);line-height:1.85}
.entry-content ul,.entry-content ol{color:var(--muted);padding-left:28px}
.entry-content li{margin-bottom:8px}
.entry-content img{border-radius:2px;margin:24px 0}
.entry-content a{color:var(--primary-link,var(--slate,#1E3A5F));text-decoration:underline}

/* FORMS */
input[type=text],input[type=email],input[type=tel],input[type=search],textarea,select{
  font-family:var(--sans);font-size:14px;padding:12px 16px;border:1px solid var(--border);
  color:var(--ink);outline:none;transition:border-color .2s;width:100%;background:var(--white)}
input:focus,textarea:focus,select:focus{border-color:var(--primary,#E8A84C)}
input::placeholder,textarea::placeholder{color:var(--muted)}

/* BUTTONS */
.btn,.wp-block-button__link{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:13px;font-weight:600;padding:12px 28px;cursor:pointer;border:none;transition:background .15s,transform .15s;letter-spacing:.03em}
.btn-primary,.wp-block-button__link{background:var(--btn-bg,var(--dawn,#E8A84C));color:var(--btn-color,var(--night,#0F1C2E))}
.btn-primary:hover{background:var(--btn-bg-hover,var(--dawn2,#C98935))}
.btn-secondary{background:var(--slate,#1E3A5F);color:#fff}
.btn-secondary:hover{background:var(--mid,#2C5282)}
.btn-outline{background:transparent;border:1px solid currentColor;color:var(--ink)}
.btn-outline:hover{background:var(--paper)}
.btn-sm{padding:9px 20px;font-size:12px}
.btn-full{width:100%;justify-content:center}

/* CRISIS / NOTICE BAR */
.site-notice{padding:9px 0;text-align:center}
.site-notice-inner{max-width:1280px;margin:0 auto;padding:0 32px;display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}
.site-notice-text{font-size:13px;color:rgba(255,255,255,.85)}
.site-notice-text strong{color:#fff}
.site-notice a.notice-cta{font-size:12px;color:#fff;font-weight:700;background:rgba(0,0,0,.2);padding:4px 14px;border-radius:2px}
.notice-dot{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.35);flex-shrink:0}

/* HEADER */
#site-header{background:var(--white);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:200;transition:box-shadow .2s}
#site-header.scrolled{box-shadow:0 2px 18px rgba(0,0,0,.09)}
.header-wrap{max-width:1280px;margin:0 auto;padding:0 32px;display:flex;align-items:center;height:68px;gap:40px}
.site-branding{display:flex;align-items:center;gap:12px;flex-shrink:0}
.custom-logo-link,.site-branding a{display:flex;align-items:center;gap:12px}
.logo-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:2px;flex-shrink:0}
.logo-mark svg{width:22px;height:22px;fill:#fff}
.site-name{font-family:var(--serif);font-size:19px;font-weight:700;color:var(--ink);letter-spacing:-.01em;line-height:1.1}
.site-tagline{font-size:10px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}

/* NAVIGATION */
#primary-menu-container{display:flex;align-items:center;gap:2px;flex:1}
#primary-menu{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
#primary-menu li a{font-size:13px;font-weight:500;color:var(--muted);padding:8px 13px;transition:color .15s;display:block;height:68px;display:flex;align-items:center}
#primary-menu li a:hover,#primary-menu .current-menu-item > a,#primary-menu .current-page-ancestor > a{color:var(--ink)}
#primary-menu .current-menu-item > a{position:relative}
#primary-menu .current-menu-item > a::after{content:'';position:absolute;bottom:-1px;left:13px;right:13px;height:2px;background:var(--primary-accent)}
.header-cta-wrap{margin-left:auto;flex-shrink:0}
.header-cta{font-size:13px;font-weight:600;padding:9px 22px;color:#fff;transition:background .2s;letter-spacing:.02em;display:inline-block}

/* HAMBURGER */
.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;color:var(--ink)}
.menu-toggle svg{width:22px;height:22px}

/* PAGE HERO */
.page-hero{padding:56px 0 48px;position:relative;overflow:hidden}
.page-hero-inner{max-width:1280px;margin:0 auto;padding:0 32px;position:relative;z-index:1}
.breadcrumb-nav{font-size:12px;color:rgba(255,255,255,.4);margin-bottom:18px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.breadcrumb-nav a{color:rgba(255,255,255,.5);transition:color .15s}
.breadcrumb-nav a:hover{color:rgba(255,255,255,.9)}
.breadcrumb-sep{color:rgba(255,255,255,.2)}
.page-eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px}
.eyebrow-dot{width:6px;height:6px;border-radius:50%}
.eyebrow-label{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.page-hero h1{font-size:clamp(28px,4vw,52px);font-weight:400;color:#fff;margin-bottom:14px;letter-spacing:-.025em}
.page-hero h1 em{font-style:italic;color:rgba(255,255,255,.45)}
.page-hero h1 strong{font-weight:700}
.page-hero-desc{font-size:15px;color:rgba(255,255,255,.5);line-height:1.85;font-weight:300;max-width:640px}

/* BLOG LOOP */
.blog-layout{display:grid;grid-template-columns:1fr 300px;gap:48px;padding:56px 0 80px;align-items:start}
.posts-list{display:flex;flex-direction:column;gap:2px;background:var(--paper2)}
.post-card{background:var(--white);display:flex;overflow:hidden;transition:box-shadow .2s}
.post-card:hover{box-shadow:0 4px 20px rgba(0,0,0,.08)}
.post-card-thumb{width:200px;min-height:160px;flex-shrink:0;background:var(--dark2,#1A2E3B);position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:14px}
.post-card-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.post-cat-badge{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;color:#fff;position:relative;z-index:1}
.post-card-body{padding:22px;flex:1;display:flex;flex-direction:column}
.post-meta{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;margin-bottom:8px}
.post-card-body h2{font-size:18px;font-weight:600;margin-bottom:8px;line-height:1.3}
.post-card-body h2 a{color:var(--ink);transition:color .15s}
.post-card-body h2 a:hover{color:var(--primary-link,var(--slate,#1E3A5F))}
.post-card-body .excerpt{font-size:13px;color:var(--muted);line-height:1.7;flex:1;margin-bottom:12px}
.read-more{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;display:inline-flex;align-items:center;gap:6px;transition:color .15s}
.read-more svg{width:12px;height:12px}
.sidebar .widget{background:var(--cream);padding:20px;margin-bottom:16px}
.sidebar .widget-title{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--paper2)}
.sidebar .widget ul{list-style:none;padding:0;margin:0}
.sidebar .widget li{padding:7px 0;border-bottom:1px solid var(--paper2);font-size:13px;color:var(--muted)}
.sidebar .widget li:last-child{border-bottom:none;padding-bottom:0}
.sidebar .widget li a{color:var(--muted);transition:color .15s}
.sidebar .widget li a:hover{color:var(--ink)}
.tagcloud a{display:inline-block;background:var(--paper2);padding:4px 10px;font-size:12px;color:var(--muted);margin:0 4px 6px 0;transition:background .15s}
.tagcloud a:hover{background:var(--paper)}
.pagination{display:flex;justify-content:center;gap:8px;margin-top:32px;flex-wrap:wrap}
.pagination .page-numbers{font-size:13px;font-weight:600;color:var(--muted);padding:8px 14px;border:1px solid var(--paper2);transition:background .15s}
.pagination .current,.pagination .page-numbers:hover{background:var(--primary-accent);color:#fff;border-color:var(--primary-accent)}

/* SINGLE POST */
.single-layout{display:grid;grid-template-columns:1fr 280px;gap:56px;padding:48px 0 80px;align-items:start}
.single-post-header{margin-bottom:32px}
.post-category-label{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.post-title{font-family:var(--serif);font-size:clamp(24px,3.5vw,42px);font-weight:500;color:var(--ink);line-height:1.15;letter-spacing:-.025em;margin-bottom:16px}
.post-byline{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--border)}
.post-byline .author-name{font-weight:600;color:var(--ink)}
.post-featured-img{margin-bottom:32px;border-radius:2px;overflow:hidden}
.post-featured-img img{width:100%;height:auto;display:block}
.medical-review-box{background:rgba(30,58,95,.06);border:1px solid rgba(30,58,95,.12);padding:16px 20px;margin-bottom:28px;display:flex;gap:14px;align-items:flex-start}
.review-box-icon{width:28px;height:28px;display:grid;place-items:center;flex-shrink:0}
.review-box-icon svg{width:14px;height:14px;fill:none;stroke-width:2}
.review-box-text{font-size:12px;line-height:1.6}
.review-box-text strong{display:block;margin-bottom:2px}
.author-box{background:var(--cream);padding:24px;margin-top:40px;display:flex;gap:20px;align-items:flex-start}
.author-box-avatar{width:64px;height:64px;background:var(--slate,#1E3A5F);border-radius:50%;flex-shrink:0;overflow:hidden}
.author-box-avatar img{width:100%;height:100%;object-fit:cover}
.author-box-name{font-family:var(--serif);font-size:16px;font-weight:600;margin-bottom:4px}
.author-box-bio{font-size:13px;color:var(--muted);line-height:1.7}
.related-posts{margin-top:48px;padding-top:40px;border-top:1px solid var(--border)}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.related-card h4{font-family:var(--serif);font-size:15px;font-weight:600;margin:10px 0 6px;line-height:1.3}
.related-card h4 a{color:var(--ink);transition:color .15s}
.related-card h4 a:hover{color:var(--primary-link,var(--slate,#1E3A5F))}
.related-card-img{height:120px;background:var(--dark2,#1A2E3B);overflow:hidden}
.related-card-img img{width:100%;height:100%;object-fit:cover}
.related-card p{font-size:12px;color:var(--muted);line-height:1.6}
.comments-section{margin-top:48px;padding-top:40px;border-top:1px solid var(--border)}
.comment-form input,.comment-form textarea{margin-bottom:10px}
.comment-form .submit{background:var(--primary-accent);color:var(--btn-color-submit,#fff);border:none;cursor:pointer;padding:12px 28px;font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.04em;transition:opacity .2s}
.comment-form .submit:hover{opacity:.85}
.comment-list{list-style:none;padding:0;margin:0 0 32px}
.comment{background:var(--cream);padding:20px;margin-bottom:8px}
.comment-author-name{font-weight:600;font-size:14px;color:var(--ink);margin-bottom:4px}
.comment-date{font-size:11px;color:var(--muted);font-family:var(--mono);letter-spacing:.04em}
.comment-content{font-size:14px;color:var(--muted);margin-top:8px;line-height:1.7}

/* SECTION LABELS */
.section-eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.eyebrow-line{width:28px;height:2px}
.eyebrow-text{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.sec-title{font-family:var(--serif);font-size:clamp(24px,3vw,40px);font-weight:500;letter-spacing:-.02em;line-height:1.15;margin-bottom:14px}
.sec-sub{font-size:14px;color:var(--muted);line-height:1.8;font-weight:300;max-width:560px;margin-bottom:0}

/* CARDS GRID */
.card-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--paper2)}
.card-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--paper2)}
.card-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--paper2)}
.info-card{background:var(--white);padding:28px 24px;transition:box-shadow .25s,transform .25s;position:relative;overflow:hidden}
.info-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;transform:scaleY(0);transform-origin:bottom;transition:transform .3s}
.info-card:hover{box-shadow:0 10px 32px rgba(0,0,0,.08);transform:translateY(-3px);z-index:1}
.info-card:hover::before{transform:scaleY(1)}
.info-card-icon{width:44px;height:44px;border:1px solid var(--paper2);display:grid;place-items:center;margin-bottom:16px}
.info-card-icon svg{width:20px;height:20px;fill:none;stroke-width:1.5}
.info-card-cat{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:7px}
.info-card h3{font-family:var(--serif);font-size:18px;font-weight:600;line-height:1.25;margin-bottom:9px}
.info-card p{font-size:13px;color:var(--muted);line-height:1.7;margin-bottom:0}

/* DISC */
.disc-strip{padding:12px 0}
.disc-strip .container{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.disc-icon{width:28px;height:28px;display:grid;place-items:center;flex-shrink:0}
.disc-icon svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2}
.disc-text{font-size:12px;color:var(--muted);line-height:1.6;flex:1}
.disc-text strong{color:var(--ink)}

/* FAQ */
.faq-list{display:flex;flex-direction:column;gap:2px;background:var(--paper2)}
.faq-item{background:var(--white)}
.faq-q{font-size:15px;font-weight:600;color:var(--ink);display:flex;justify-content:space-between;gap:16px;cursor:pointer;padding:18px 22px;transition:background .15s;line-height:1.3;border:none;background:none;width:100%;font-family:var(--sans);text-align:left}
.faq-q:hover{background:var(--cream)}
.faq-q svg{width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2;flex-shrink:0;transition:transform .2s}
.faq-item.open .faq-q svg{transform:rotate(45deg)}
.faq-a{display:none;padding:0 22px 18px;font-size:14px;color:var(--muted);line-height:1.8;border-top:1px solid var(--paper2);padding-top:14px}
.faq-item.open .faq-a{display:block}

/* 404 */
.error-404-content{padding:120px 32px;text-align:center;max-width:600px;margin:0 auto}
.error-404-content h1{font-family:var(--serif);font-size:80px;font-weight:700;color:var(--paper2);line-height:1;margin-bottom:16px}
.error-404-content h2{font-size:24px;margin-bottom:12px}
.error-404-content p{color:var(--muted);margin-bottom:24px}

/* FOOTER */
#site-footer{padding:60px 0 0}
.footer-grid{max-width:1280px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:2.2fr 1fr 1fr 1.4fr;gap:56px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.07)}
.footer-brand{}
.footer-logo-row{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.footer-logo-ico{width:30px;height:30px;display:grid;place-items:center;flex-shrink:0}
.footer-logo-ico svg{width:15px;height:15px;fill:#fff}
.footer-logo-name{font-family:var(--serif);font-size:16px;font-weight:700;color:#fff}
.footer-about-text{font-size:13px;line-height:1.8;max-width:280px;margin-bottom:16px}
.footer-note{padding:14px 16px;margin-top:8px}
.footer-note-label{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-family:var(--mono);margin-bottom:4px}
.footer-note-text{font-size:12px;line-height:1.6}
footer h5{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.22);margin-bottom:16px}
.footer-nav{display:flex;flex-direction:column;gap:9px;list-style:none;padding:0;margin:0}
.footer-nav a{font-size:13px;color:rgba(255,255,255,.38);transition:color .15s}
.footer-nav a:hover{color:#fff}
.footer-info-rows{display:flex;flex-direction:column;gap:8px}
.footer-info-row{display:flex;justify-content:space-between;font-size:12px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.05)}
.footer-info-row:last-child{border-bottom:none}
.footer-info-label{color:rgba(255,255,255,.3)}
.footer-info-val{color:rgba(255,255,255,.2);font-family:var(--mono);font-size:11px}
.footer-bottom-bar{max-width:1280px;margin:0 auto;padding:16px 32px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:11px}
.footer-bottom-bar a{transition:color .15s}
.footer-bottom-links{display:flex;gap:20px}
.footer-disclaimer{max-width:1280px;margin:0 auto;padding:0 32px 20px;font-size:11px;line-height:1.7}

@media(max-width:1100px){.footer-grid{grid-template-columns:1fr 1fr}.single-layout{grid-template-columns:1fr}.blog-layout{grid-template-columns:1fr}.related-grid{grid-template-columns:1fr 1fr}}
@media(max-width:768px){
  #primary-menu-container{display:none;position:absolute;top:68px;left:0;right:0;background:var(--white);padding:16px;border-bottom:1px solid var(--border);flex-direction:column}
  #primary-menu-container.active{display:flex}
  #primary-menu{flex-direction:column;gap:0}
  #primary-menu li a{height:auto;padding:10px 16px;border-bottom:1px solid var(--border)}
  .menu-toggle{display:flex}
  .header-cta-wrap{display:none}
  .footer-grid{grid-template-columns:1fr}
  .card-grid-3,.card-grid-4{grid-template-columns:1fr}
  .related-grid{grid-template-columns:1fr}
  .post-card{flex-direction:column}
  .post-card-thumb{width:100%;min-height:120px}
  .container{padding:0 20px}
}

/* ── THEME-SPECIFIC ────────────────────────────────────────── */
body { font-family: 'Lora', Georgia, serif; }
.logo-mark,.header-cta { background:#E8A84C; }
.header-cta:hover { background:#C98935; }
#primary-menu .current-menu-item > a::after { background:#E8A84C; }
.btn-primary,.wp-block-button__link { background:#E8A84C;color:var(--night,#0F1C2E); }
.btn-primary:hover { background:#C98935; }
.read-more { color:#E8A84C; }
.eyebrow-line { background:#E8A84C; }
.eyebrow-text,.eyebrow-label { color:#E8A84C; }
.info-card-cat { color:#E8A84C; }
.info-card::before { background:#E8A84C; }
.page-hero { background:var(--hero-bg,#0F1C2E); }
.eyebrow-dot { background:#E8A84C; }
.pagination .current { background:#E8A84C;border-color:#E8A84C; }
.post-cat-badge { background:#E8A84C; }
.faq-item.open .faq-q { color:#E8A84C; }
.faq-item.open .faq-q svg { stroke:#E8A84C; }
.site-notice { background:#4A8C6A; }
#site-footer { background:#0F1C2E; }
.footer-logo-ico { background:#E8A84C; }
