/*
Theme Name: Raiyan's Custom Theme
Theme URI: https://raiyanhaider.com/
Author: Raiyan Haider
Author URI: https://raiyanhaider.com/
Description: A blazing-fast, minimal blog theme custom made by Raiyan Haider. Zero external dependencies. Auto table of contents. Fully responsive.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rct
Tags: blog, minimal, fast, responsive, custom-menu, post-thumbnails
*/

/* ── VARIABLES ─────────────────────────────────────────────── */
:root{--p:#000;--a:#2563eb;--t:#0f172a;--s:#475569;--su:#f1f5f9;--sh:#e2e8f0;--bg:#fff;--ff:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--fm:'Courier New',Courier,monospace}

/* ── RESET ──────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--ff);color:var(--t);background:var(--bg);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font:inherit;cursor:pointer}
input{font:inherit}
svg{display:block}

/* ── LAYOUT ─────────────────────────────────────────────────── */
/* a1=body wrapper  a2=sidebar  a3=main  a4=header  a5=wide content  a6=narrow content  a7=ambient bg */
.a1{display:flex;min-height:100vh}
.a2{position:fixed;top:0;left:0;height:100%;width:5rem;display:none;flex-direction:column;justify-content:space-between;padding:1.25rem .75rem;z-index:50;border-right:1px solid rgba(0,0,0,.08);background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.a3{flex:1;min-height:100vh;background:#fff}
.a4{position:sticky;top:0;z-index:40;padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,.08)}
.a5{width:100%;max-width:80rem;margin:0 auto;padding:2rem 1rem 3rem}
.a6{width:100%;max-width:52rem;margin:0 auto;padding:2rem 1rem 3rem}
.a7{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:-1;overflow:hidden}
.a7::before{content:'';position:absolute;top:-10%;left:-10%;width:40%;height:40%;border-radius:50%;background:rgba(0,0,0,.03);filter:blur(120px)}
.a7::after{content:'';position:absolute;bottom:-10%;right:-10%;width:40%;height:40%;border-radius:50%;background:rgba(37,99,235,.03);filter:blur(120px)}

/* ── SIDEBAR ────────────────────────────────────────────────── */
/* b1=logo area  b2=logo icon  b3=logo text  b4=nav ul  b5=nav li  b6=nav link  b7=active  b8=icon  b9=label  ba=footer */
.b1{display:flex;align-items:center;gap:.75rem;margin-bottom:2rem;overflow:hidden}
.b2{width:2.5rem;height:2.5rem;min-width:2.5rem;border-radius:.5rem;background:linear-gradient(135deg,#000,var(--a));display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--fm);font-size:.65rem;font-weight:700;flex-shrink:0}
.b3{font-family:var(--fm);font-weight:700;font-size:.8rem;white-space:nowrap;line-height:1.3;display:none}
.b4{display:flex;flex-direction:column;gap:.1rem}
.b5{display:block}
.b6{display:flex;align-items:center;gap:.75rem;padding:.65rem .75rem;border-radius:.6rem;color:var(--s);transition:color .2s,background .2s;overflow:hidden;white-space:nowrap}
.b6:hover,.b6:focus{background:var(--su);color:var(--t)}
.b7{color:var(--a)!important;background:rgba(37,99,235,.08)!important}
.b8{display:flex;flex-shrink:0}
.b9{font-size:.875rem;font-weight:500;display:none}
.ba{font-size:.65rem;font-family:var(--fm);color:var(--s);padding-top:1rem;border-top:1px solid rgba(0,0,0,.08);line-height:1.7}
.ba a{color:var(--a)}

/* ── HEADER ─────────────────────────────────────────────────── */
/* c1=search form  c2=input  c3=search icon  c4=actions  c5=icon btn  c6=notif dot  c7=avatar  c8=mobile logo */
.c1{position:relative;display:none}
.c2{padding:.5rem 1rem .5rem 2.5rem;border:1px solid rgba(0,0,0,.1);border-radius:9999px;background:var(--su);font-family:var(--fm);font-size:.8rem;outline:none;width:260px;color:var(--t);transition:border-color .2s,background .2s}
.c2:focus{border-color:rgba(37,99,235,.4);background:#fff}
.c2::placeholder{color:var(--s)}
.c3{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:var(--s);pointer-events:none;display:flex}
.c4{display:flex;align-items:center;gap:.75rem}
.c5{width:2.25rem;height:2.25rem;min-width:2.25rem;border-radius:50%;border:1px solid rgba(0,0,0,.1);background:var(--su);display:flex;align-items:center;justify-content:center;transition:background .2s;position:relative;color:var(--s)}
.c5:hover{background:var(--sh)}
.c6{position:absolute;top:.25rem;right:.25rem;width:.45rem;height:.45rem;border-radius:50%;background:var(--s)}
.c7{width:2.25rem;height:2.25rem;min-width:2.25rem;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--a));border:2px solid rgba(0,0,0,.1);display:flex;align-items:center;justify-content:center;color:#fff;font-size:.75rem;font-family:var(--fm);font-weight:700}
.c8{display:flex;align-items:center;gap:.5rem}

/* ── HERO ───────────────────────────────────────────────────── */
/* d1=hero  d2=h1  d3=accent span  d4=paragraph */
.d1{margin-bottom:3rem}
.d2{font-size:2.5rem;font-weight:700;letter-spacing:-.02em;color:var(--t);line-height:1.1;margin-bottom:.25rem}
.d3{color:var(--a);font-family:var(--fm);font-size:1.5rem;font-weight:700}
.d4{color:var(--s);font-size:1rem;max-width:38rem;margin-top:1rem;line-height:1.75}

/* ── CARDS & GRID ───────────────────────────────────────────── */
/* e2=grid  e3=card  e4=img wrap  e5=img  e6=gradient  e7=badge  e8=body  e9=title  ea=excerpt  eb=footer  ec=read more  ed=pagination */
.e2{display:grid;grid-template-columns:1fr;gap:1.5rem}
.e3{border-radius:1rem;overflow:hidden;border:1px solid rgba(0,0,0,.05);background:rgba(255,255,255,.7);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;flex-direction:column;transition:transform .35s,box-shadow .35s,border-color .35s;position:relative}
.e3:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.09);border-color:rgba(0,0,0,.14)}
.e4{display:block;position:relative;height:12rem;overflow:hidden;flex-shrink:0}
.e5{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.e3:hover .e5{transform:scale(1.08)}
.e6{position:absolute;inset:0;background:linear-gradient(to top,var(--su),transparent)}
.e7{position:absolute;top:.75rem;right:.75rem;padding:.2rem .65rem;border-radius:9999px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:.7rem;font-weight:500;color:var(--t);border:1px solid rgba(0,0,0,.08);z-index:2}
.e8{padding:1.25rem;display:flex;flex-direction:column;flex:1}
.e9{font-size:1rem;font-weight:700;color:var(--t);margin-bottom:.5rem;line-height:1.3}
.e9 a{color:inherit;transition:color .2s}
.e3:hover .e9 a{color:var(--a)}
.e9 a::after{content:'';position:absolute;inset:0;z-index:1}
.ea{font-size:.85rem;color:var(--s);flex:1;margin-bottom:1rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.eb{border-top:1px solid rgba(0,0,0,.05);padding-top:.75rem;margin-top:auto}
.ec{font-size:.875rem;font-weight:500;color:var(--a);display:inline-flex;align-items:center;gap:.4rem;transition:color .2s;position:relative;z-index:2}
.ec:hover{color:var(--p)}
.ec svg{transition:transform .2s}
.ec:hover svg{transform:translateX(3px)}
.ed{margin-top:3.5rem;display:flex;justify-content:center}
.ed a{padding:.875rem 2rem;background:var(--p);color:#fff;border-radius:9999px;font-size:.9rem;font-weight:500;letter-spacing:.02em;transition:background .2s,box-shadow .2s;display:inline-flex;align-items:center;gap:.5rem;box-shadow:0 4px 15px rgba(0,0,0,.18)}
.ed a:hover{background:#222;box-shadow:0 6px 20px rgba(0,0,0,.25)}

/* ── SINGLE POST ────────────────────────────────────────────── */
/* f2=back btn  f3=art header  f4=meta  f5=title  f6=author  f7=img wrap  f8=img  f9=content  fa=related  fb=related grid */
.f2{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--fm);font-size:.8rem;color:var(--s);margin-bottom:2rem;background:none;border:none;padding:0;transition:color .2s;cursor:pointer}
.f2:hover{color:var(--t)}
.f2 svg{transition:transform .2s}
.f2:hover svg{transform:translateX(-3px)}
.f3{margin-bottom:1.5rem}
.f4{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.75rem}
.f4 .e7{position:static}
.f5{font-size:1.8rem;font-weight:700;color:var(--t);line-height:1.2;margin-bottom:1rem}
.f6{display:flex;align-items:center;gap:.75rem;color:var(--s);font-size:.85rem}
.f6 img{width:2rem;height:2rem;border-radius:50%;object-fit:cover}
.f7{border-radius:1rem;overflow:hidden;margin-bottom:2rem;border:1px solid rgba(0,0,0,.07)}
.f8{width:100%;height:18rem;object-fit:cover}
.f9{color:var(--s);font-size:1rem;line-height:1.85}
.f9 p{margin-bottom:1.25rem}
.f9 h2,.f9 h3,.f9 h4{color:var(--t);font-weight:700;margin:2.25rem 0 .75rem;line-height:1.3}
.f9 h2{font-size:1.45rem}
.f9 h3{font-size:1.2rem}
.f9 h4{font-size:1rem}
.f9 ul,.f9 ol{padding-left:1.5rem;margin-bottom:1.25rem}
.f9 ul{list-style:disc}
.f9 ol{list-style:decimal}
.f9 li{margin-bottom:.4rem}
.f9 blockquote{border-left:3px solid var(--a);padding:1rem 1.25rem;background:var(--su);border-radius:0 .5rem .5rem 0;margin:1.5rem 0;font-style:italic;color:var(--t)}
.f9 a{color:var(--a)}
.f9 a:hover{text-decoration:underline}
.f9 code{font-family:var(--fm);background:var(--su);padding:.1rem .4rem;border-radius:.25rem;font-size:.9em}
.f9 pre{background:var(--su);padding:1rem;border-radius:.5rem;overflow-x:auto;margin-bottom:1.25rem}
.f9 pre code{background:none;padding:0}
.f9 img{border-radius:.5rem;margin:1.25rem 0;max-width:100%}
.f9 strong{color:var(--t)}
.f9 hr{border:none;border-top:1px solid rgba(0,0,0,.1);margin:2rem 0}
.fa{border-top:1px solid rgba(0,0,0,.1);padding-top:2.5rem;margin-top:2.5rem}
.fa h3{font-size:1.4rem;font-weight:700;font-family:var(--fm);margin-bottom:1.75rem}
.fb{display:grid;grid-template-columns:1fr;gap:1.5rem}

/* ── TABLE OF CONTENTS ──────────────────────────────────────── */
/* g1=wrap  g2=title  g3=list  g4=item  g5=link  g6=indent-h3  g7=indent-h4 */
.g1{background:var(--su);border-radius:1rem;padding:1.25rem 1.5rem;margin-bottom:2rem;border:1px solid rgba(0,0,0,.06)}
.g2{font-size:.75rem;font-weight:700;font-family:var(--fm);color:var(--t);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.75rem}
.g3{display:flex;flex-direction:column;gap:.25rem}
.g4{font-size:.875rem}
.g5{color:var(--s);display:block;padding:.2rem 0;transition:color .2s}
.g5:hover{color:var(--a)}
.g6{padding-left:1rem}
.g7{padding-left:2rem}

/* ── META / UTILITIES ───────────────────────────────────────── */
.i1{font-family:var(--fm);font-size:.75rem;color:var(--s)}

/* ── MOBILE NAV ─────────────────────────────────────────────── */
/* mn=nav bar  mi=items ul  m3=item link  m4=active  m5=label  mf=footer text */
.mn{display:none;position:fixed;bottom:0;left:0;right:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(0,0,0,.08);padding:.6rem 1rem .9rem}
.mi{display:flex;align-items:center;justify-content:space-around}
.mi li{flex:1;display:flex;justify-content:center}
.m3{display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:.3rem .5rem;color:var(--s);transition:color .2s;background:none;border:none;font-family:var(--ff)}
.m3:hover,.m3:focus{color:var(--t)}
.m4{color:var(--a)!important}
.m5{font-size:.62rem;font-weight:500}
.mf{text-align:center;font-size:.6rem;color:var(--s);font-family:var(--fm);margin-top:.5rem;border-top:1px solid rgba(0,0,0,.06);padding-top:.4rem;line-height:1.6}
.mf a{color:var(--a)}

/* ── ARCHIVE / SEARCH ───────────────────────────────────────── */
.ah{margin-bottom:2rem}
.ah h1{font-size:1.8rem;font-weight:700;margin-bottom:.5rem}
.ah p{color:var(--s);font-size:.95rem}
.search-form{display:flex;gap:.5rem;margin-bottom:2rem}
.search-form label{display:flex;flex:1}
.search-field{flex:1;padding:.6rem 1rem;border:1px solid rgba(0,0,0,.15);border-radius:9999px;outline:none;font:inherit;font-size:.9rem;transition:border-color .2s}
.search-field:focus{border-color:var(--a)}
.search-submit{padding:.6rem 1.5rem;background:var(--p);color:#fff;border:none;border-radius:9999px;font:inherit;font-weight:500;cursor:pointer;transition:background .2s}
.search-submit:hover{background:#222}

/* ── 404 ────────────────────────────────────────────────────── */
.nf4{text-align:center;padding:5rem 1rem}
.nf4 h1{font-size:5rem;font-weight:700;color:var(--a);font-family:var(--fm);line-height:1}
.nf4 h2{font-size:1.5rem;font-weight:700;margin:.5rem 0 1rem}
.nf4 p{color:var(--s);margin-bottom:2rem}
.nf4 a{display:inline-block;padding:.75rem 2rem;background:var(--p);color:#fff;border-radius:9999px;font-weight:500;transition:background .2s}
.nf4 a:hover{background:#222}

/* ── WP ADMIN BAR OFFSET ────────────────────────────────────── */
.admin-bar .a2{top:32px;height:calc(100% - 32px)}
.admin-bar .a4{top:32px}
@media(max-width:782px){
  .admin-bar .a2{top:46px;height:calc(100% - 46px)}
  .admin-bar .a4{top:46px}
}

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media(min-width:480px){.d2{font-size:3rem}.d3{font-size:1.8rem}}

@media(min-width:640px){
  .e2{grid-template-columns:repeat(2,1fr)}
  .fb{grid-template-columns:repeat(2,1fr)}
  .d2{font-size:3.5rem}
  .d3{font-size:2rem}
  .f5{font-size:2.2rem}
  .f8{height:22rem}
}

@media(min-width:768px){
  .a2{display:flex}
  .a3{margin-left:5rem}
  .mn{display:none!important}
  .c1{display:block}
  .c8{display:none}
  .a3{padding-bottom:0}
}

@media(min-width:1024px){
  .a2{width:16rem}
  .a3{margin-left:16rem}
  .b3,.b9{display:block}
  .d2{font-size:4rem}
  .d3{font-size:2.5rem}
  .e2{grid-template-columns:repeat(3,1fr)}
  .c2{width:300px}
  .a5{padding:3rem 2rem 4rem}
  .a6{padding:3rem 2rem 4rem}
  .f5{font-size:2.5rem}
  .f8{height:28rem}
}

@media(min-width:1280px){.e2{grid-template-columns:repeat(4,1fr)}}

@media(max-width:767px){
  .mn{display:block}
  .a3{padding-bottom:5rem}
  .c1{display:none}
}