/*
Theme Name:    Blog-Cannabis
Theme URI:     https://www.blog-cannabis.com
Author:        Blog-Cannabis
Author URI:    https://www.blog-cannabis.com
Description:   Le Journal Botanique - Theme editorial premium
Version:       1.2.0
Requires at least: 5.8
Tested up to:  6.7
License:       GPL-2.0-or-later
Text Domain:   blog-cannabis
*/
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400;1,700&family=Syne:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&display=swap');

:root {
    --cr: #faf8f3; --cr2: #f0ece3; --cr3: #e5dfd5; --iv: #fffef9;
    --fo: #1a3a2a; --fo2: #2d5a42; --mo: #3d7a5a; --sa: #7aaa8e; --sa2: #b8d4c4;
    --go: #c8a44e; --go2: #f5ecd0; --go3: #a68935;
    --ch: #1c1c1c; --ink: #2a2a28; --tx: #3a3a38; --tx2: #6a6a68; --tx3: #9a9a98;
    --ln: rgba(26,58,42,.06); --ln2: rgba(26,58,42,.12);
    --ff-h: 'Playfair Display', Georgia, serif;
    --ff-b: 'Instrument Serif', Georgia, serif;
    --ff-u: 'Syne', system-ui, sans-serif;
    --ff-m: 'IBM Plex Mono', monospace;
    --r: 16px; --r-sm: 10px; --r-lg: 22px; --r-xl: 32px; --r-f: 50px;
    --sh: 0 2px 8px rgba(26,58,42,.04);
    --shm: 0 8px 28px rgba(26,58,42,.06);
    --shl: 0 20px 56px rgba(26,58,42,.1);
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: var(--ff-b); font-size: 16px; line-height: 1.7; color: var(--tx); background: var(--cr); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: var(--fo); text-decoration: none; transition: color .2s; }
a:hover { color: var(--mo); }
img { max-width: 100%; height: auto; display: block; }
h1,h2,h3,h4,h5,h6 { font-family: var(--ff-h); color: var(--ch); line-height: 1.2; margin: 0; }
p { margin: 0 0 1em; }
ul, ol { margin: 0; padding: 0; }
::selection { background: var(--go2); color: var(--fo); }
html { scroll-behavior: smooth; overflow-x: hidden; }

body::after { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9998; opacity: .018; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--cr2); }
::-webkit-scrollbar-thumb { background: var(--fo); border-radius: 3px; }

.wrap { max-width: 1440px; margin: 0 auto; padding: 0 48px; }
.wrap-narrow { max-width: 800px; }
.site { min-height: 60vh; }
.layout { display: grid; grid-template-columns: 1fr 320px; gap: 48px; align-items: start; }

/* ============================
   SCROLL PROGRESS
   ============================ */
.sp { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 10001; background: linear-gradient(90deg, #1a3a2a, #3d7a5a, #c8a44e, #b8d4c4); background-size: 300% 100%; animation: spGrad 4s ease infinite; transition: width .05s linear; }
@keyframes spGrad { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }

/* ============================
   MOUSE GRADIENT
   ============================ */
.mgrad { position: fixed; inset: 0; pointer-events: none; z-index: 1; opacity: .06; }
.mgrad-inner { width: 700px; height: 700px; border-radius: 50%; background: radial-gradient(circle, #c8a44e 0%, transparent 65%); position: absolute; transform: translate(-50%,-50%); filter: blur(100px); }

/* ============================
   DARK MODE TOGGLE
   ============================ */
.ttog { position: fixed; bottom: 28px; right: 28px; z-index: 1000; width: 50px; height: 50px; border-radius: 50%; background: var(--iv); border: 1px solid var(--ln2); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .3s; box-shadow: 0 4px 20px rgba(0,0,0,.06); }
.ttog:hover { transform: scale(1.1) rotate(15deg); box-shadow: 0 8px 28px rgba(0,0,0,.1); }
.ttog svg { width: 18px; height: 18px; stroke: var(--tx); fill: none; stroke-width: 2; transition: all .3s; }

/* ============================
   DARK MODE OVERRIDES
   ============================ */
body.dark { --cr: #0e1210; --cr2: #151a17; --cr3: #1c2420; --iv: #141a16; --tx: #d4d8d5; --tx2: #8a9a90; --tx3: #5a6a60; --ch: #f0f4f1; --ln: rgba(255,255,255,.04); --ln2: rgba(255,255,255,.08); }
body.dark img { filter: brightness(.92); }
body.dark .hdr { background: rgba(14,18,16,.85) !important; }
body.dark .ttog { background: rgba(20,26,22,.8); border-color: rgba(255,255,255,.08); }
body.dark .ttog svg { stroke: #c8a44e; }
body.dark .mgrad { opacity: .03; }
body.dark .card, body.dark .strip-card, body.dark .s-widget { border-color: rgba(255,255,255,.04); }
body.dark .card-title a:hover, body.dark .strip-card:hover .strip-title, body.dark .hero-title a:hover { color: #c8a44e !important; }
body.dark .nav-list > li > a:hover, body.dark .nav-list > li.current-menu-item > a { color: #c8a44e; background: rgba(200,164,78,.05); }
body.dark .btn { background: #c8a44e; color: #1c1c1c; }
body.dark ::-webkit-scrollbar-track { background: #111; }
body.dark ::-webkit-scrollbar-thumb { background: #c8a44e; }

/* ============================
   TICKER
   ============================ */
.tk {
    background: #1a3a2a;
    color: #b8d4c4;
    overflow: hidden;
    height: 42px;
    max-height: 42px;
    display: flex;
    align-items: center;
    font-family: var(--ff-m);
    font-size: 12px;
    position: relative;
    z-index: 100;
}
.tk-t {
    display: flex;
    white-space: nowrap;
    will-change: transform;
    align-items: center;
    height: 42px;
}
.tk-i {
    padding: 0 48px;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
    white-space: nowrap;
    height: 42px;
    line-height: 42px;
}
.tk-i a { color: #b8d4c4; transition: color .15s; }
.tk-i a:hover { color: #c8a44e; }
.tk-d {
    width: 5px; height: 5px; border-radius: 50%;
    background: #c8a44e;
    animation: tkPulse 2s ease-in-out infinite;
    flex-shrink: 0;
}
.tk-h {
    color: #c8a44e; font-weight: 600; font-size: 9px;
    letter-spacing: .14em; text-transform: uppercase;
    padding: 3px 10px;
    border: 1px solid rgba(200,164,78,.25);
    border-radius: 20px;
    flex-shrink: 0;
    line-height: 1;
}
@keyframes tkPulse { 0%,100% { opacity: 1; } 50% { opacity: .25; } }

/* ============================
   HEADER
   ============================ */
.hdr {
    background: rgba(250,248,243,.85);
    backdrop-filter: blur(32px) saturate(1.8);
    -webkit-backdrop-filter: blur(32px) saturate(1.8);
    border-bottom: 1px solid var(--ln);
    position: sticky; top: 0; z-index: 1000;
    transition: all .4s;
}
.hdr.stuck { box-shadow: 0 1px 0 var(--ln2), 0 4px 20px rgba(26,58,42,.04); }
.hdr-inner { display: flex; align-items: center; gap: 28px; height: 74px; }
.logo { flex-shrink: 0; display: flex; align-items: center; }
.logo-img { height: 42px; width: auto; }
.logo-txt { font-family: var(--ff-u); font-size: 12px; font-weight: 800; color: var(--fo); letter-spacing: .3em; text-transform: uppercase; }
.nav { flex: 1; }
.nav-list { list-style: none; display: flex; gap: 2px; flex-wrap: wrap; margin: 0; padding: 0; }
.nav-list > li { position: relative; }
.nav-list > li > a { display: block; padding: 8px 16px; font-family: var(--ff-u); font-size: 11.5px; font-weight: 600; color: var(--tx2); border-radius: 8px; transition: all .15s; letter-spacing: .03em; }
.nav-list > li > a:hover, .nav-list > li.current-menu-item > a, .nav-list > li.current_page_item > a { color: var(--fo); background: rgba(26,58,42,.05); }
.nav-list .sub-menu { position: absolute; top: calc(100% + 4px); left: 0; background: var(--iv); border: 1px solid var(--ln2); border-radius: 14px; box-shadow: 0 20px 48px rgba(26,58,42,.08); min-width: 240px; padding: 8px; list-style: none; display: none; z-index: 99; }
.nav-list li:hover > .sub-menu { display: block; }
.nav-list .sub-menu a { display: block; padding: 10px 16px; font-family: var(--ff-u); font-size: 13px; color: var(--tx2); border-radius: 8px; transition: all .12s; }
.nav-list .sub-menu a:hover { background: rgba(26,58,42,.04); color: var(--fo); }
.hdr-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.hdr-search { display: flex; align-items: center; background: var(--cr2); border: 1px solid var(--ln); border-radius: 50px; overflow: hidden; transition: all .2s; }
.hdr-search:focus-within { background: var(--iv); border-color: var(--fo); box-shadow: 0 0 0 3px var(--go2); }
.hdr-search input { border: 0; background: transparent; padding: 9px 16px; font-family: var(--ff-u); font-size: 13px; color: var(--tx); outline: none; width: 180px; }
.hdr-search input::placeholder { color: var(--tx3); }
.hdr-search button { background: none; border: 0; padding: 9px 14px 9px 0; color: var(--tx3); cursor: pointer; display: flex; transition: color .15s; }
.hdr-search button:hover { color: var(--fo); }
.hdr-burger { display: none; background: none; border: 1px solid var(--ln2); border-radius: 8px; width: 42px; height: 42px; flex-direction: column; gap: 5px; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.hdr-burger span { display: block; width: 18px; height: 2px; background: var(--tx2); border-radius: 1px; transition: all .2s; }
.hdr-burger.open span:nth-child(1) { transform: rotate(45deg) translate(4px,4px); }
.hdr-burger.open span:nth-child(2) { opacity: 0; }
.hdr-burger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* ============================
   BADGE / META / BUTTON
   ============================ */
.badge { display: inline-block; padding: 6px 16px; border-radius: 50px; font-family: var(--ff-u); font-size: 10px; font-weight: 700; color: #fff; letter-spacing: .12em; text-transform: uppercase; background: var(--badge, var(--fo)); transition: all .15s; border: 1px solid rgba(255,255,255,.15); }
.badge:hover { opacity: .85; color: #fff; }
.meta { font-family: var(--ff-m); font-size: 12px; color: var(--tx3); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.meta-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--ln2); flex-shrink: 0; }
.btn { display: inline-flex; align-items: center; gap: 10px; padding: 16px 36px; background: var(--fo); color: #faf8f3; font-family: var(--ff-u); font-weight: 600; font-size: 14px; border-radius: 50px; border: 0; cursor: pointer; transition: all .35s cubic-bezier(.16,1,.3,1); letter-spacing: .03em; }
.btn:hover { background: var(--fo); color: #faf8f3; transform: translateY(-3px); box-shadow: 0 16px 40px rgba(26,58,42,.2); }
.sec-title { font-family: var(--ff-h); font-size: 28px; font-weight: 700; color: var(--ch); display: flex; align-items: center; gap: 12px; margin: 0 0 32px; letter-spacing: -.02em; }
.sec-icon { font-size: 18px; }

/* ============================
   HERO
   ============================ */
.hero { padding: 64px 0; background: var(--iv); border-bottom: 1px solid var(--ln); position: relative; overflow: hidden; }
.hero-blobs { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.hero-blob { position: absolute; border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; filter: blur(80px); }
.hero-blob:nth-child(1) { width: 45vw; height: 45vw; top: -15%; right: -10%; background: rgba(200,164,78,.05); animation: heroBlob 20s ease-in-out infinite; }
.hero-blob:nth-child(2) { width: 35vw; height: 35vw; bottom: -10%; left: -8%; background: rgba(26,58,42,.04); animation: heroBlob2 16s ease-in-out infinite; }
.hero-blob:nth-child(3) { width: 20vw; height: 20vw; top: 35%; left: 25%; background: rgba(122,170,142,.03); animation: heroBlob3 14s ease-in-out infinite; }
@keyframes heroBlob { 0% { border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; transform: translate(0,0); } 33% { border-radius: 70% 30% 30% 70% / 70% 70% 30% 30%; transform: translate(30px,-40px); } 66% { border-radius: 50% 50% 30% 70% / 60% 40% 60% 40%; transform: translate(-20px,20px); } 100% { border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; transform: translate(0,0); } }
@keyframes heroBlob2 { 0% { border-radius: 70% 30% 50% 50% / 40% 60% 40% 60%; transform: translate(0,0); } 50% { border-radius: 30% 70% 70% 30% / 60% 40% 60% 40%; transform: translate(20px,-30px); } 100% { border-radius: 70% 30% 50% 50% / 40% 60% 40% 60%; transform: translate(0,0); } }
@keyframes heroBlob3 { 0% { border-radius: 50%; transform: scale(1); } 50% { border-radius: 30% 70% 30% 70%; transform: scale(1.1); } 100% { border-radius: 50%; transform: scale(1); } }
.hero-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 64px; align-items: center; position: relative; z-index: 1; }
.hero-img { display: block; border-radius: var(--r-xl); overflow: hidden; box-shadow: var(--shl); position: relative; }
.hero-img-inner { display: block; overflow: hidden; border-radius: var(--r-xl); }
.hero-img img { width: 100%; height: 440px; object-fit: cover; transition: transform 12s ease; }
.hero-img:hover img { transform: scale(1.06); }
.hero-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(26,58,42,.1)); pointer-events: none; border-radius: var(--r-xl); }
.hero-body { padding: 8px 0; position: relative; z-index: 1; }
.hero-title { font-family: var(--ff-h); font-size: clamp(30px, 4vw, 48px); font-weight: 700; line-height: 1.1; margin: 18px 0 22px; letter-spacing: -.035em; }
.hero-title a { color: var(--ch); transition: color .2s; }
.hero-title a:hover { color: var(--fo); }
.hero-excerpt { font-family: var(--ff-b); font-size: 18px; color: var(--tx2); line-height: 1.8; margin: 0 0 22px; }

/* ============================
   STRIP (A la une)
   ============================ */
.strip { padding: 48px 0; background: var(--cr); border-bottom: 1px solid var(--ln); }
.strip-head { margin-bottom: 28px; }
.strip-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.strip-card { display: block; background: var(--iv); border: 1px solid var(--ln); border-radius: var(--r-lg); overflow: hidden; transition: all .4s cubic-bezier(.16,1,.3,1); color: inherit; }
.strip-card:hover { border-color: var(--ln2); box-shadow: 0 20px 48px rgba(26,58,42,.08); transform: translateY(-6px); }
.strip-thumb { overflow: hidden; aspect-ratio: 16/10; }
.strip-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.16,1,.3,1); }
.strip-card:hover .strip-thumb img { transform: scale(1.06); }
.strip-info { padding: 18px; }
.strip-cat { font-family: var(--ff-u); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.strip-title { font-family: var(--ff-h); font-size: 16px; font-weight: 700; color: var(--ch); line-height: 1.3; margin: 8px 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color .2s; }
.strip-card:hover .strip-title { color: var(--fo); }
.strip-date { font-family: var(--ff-m); font-size: 11px; color: var(--tx3); }

/* ============================
   MARQUEE
   ============================ */
.mrq {
    border-top: 1px solid var(--ln);
    border-bottom: 1px solid var(--ln);
    overflow: hidden;
    background: var(--iv);
    position: relative;
    z-index: 2;
    height: 80px;
    display: flex;
    align-items: center;
}
.mrq-t {
    display: flex;
    white-space: nowrap;
    will-change: transform;
    align-items: center;
    height: 80px;
}
.mrq-i {
    font-family: var(--ff-h);
    font-size: clamp(40px, 6vw, 72px);
    font-weight: 400;
    font-style: italic;
    padding: 0 28px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 28px;
    color: var(--cr3);
    transition: color .5s;
    white-space: nowrap;
    line-height: 1;
}
.mrq-i:hover { color: var(--fo); }
body.dark .mrq { background: var(--cr2); }
body.dark .mrq-i:hover { color: #c8a44e; }
.mrq-i span { font-style: normal; font-size: 9px; color: #c8a44e; font-family: var(--ff-u); font-weight: 800; letter-spacing: .25em; text-transform: uppercase; }

/* ============================
   STATS BAR
   ============================ */
.stats-sec {
    background: #1a3a2a;
    position: relative;
    overflow: hidden;
    z-index: 2;
    width: 100%;
}
.stats-sec::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: .025;
    background-image: url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23fff' stroke-width='.3'%3E%3Ccircle cx='60' cy='60' r='50'/%3E%3Ccircle cx='60' cy='60' r='30'/%3E%3Ccircle cx='60' cy='60' r='10'/%3E%3Cline x1='60' y1='10' x2='60' y2='110'/%3E%3Cline x1='10' y1='60' x2='110' y2='60'/%3E%3C/g%3E%3C/svg%3E");
}
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    max-width: 1440px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
.st {
    text-align: center;
    padding: 52px 24px;
    border-right: 1px solid rgba(255,255,255,.04);
    transition: all .3s;
    position: relative;
    cursor: default;
}
.st:last-child { border-right: none; }
.st:hover { background: rgba(255,255,255,.02); }
.st-n {
    font-family: var(--ff-h);
    font-size: 60px;
    font-style: italic;
    color: #faf8f3;
    line-height: 1;
    margin-bottom: 10px;
    display: block;
}
.st-l {
    font-family: var(--ff-u);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: #7aaa8e;
}
.st-bar {
    position: absolute;
    bottom: 0; left: 50%;
    transform: translateX(-50%);
    width: 0; height: 3px;
    background: linear-gradient(to right, #c8a44e, #b8d4c4);
    border-radius: 2px;
    transition: width .4s cubic-bezier(.16,1,.3,1);
}
.st:hover .st-bar { width: 50px; }

/* ============================
   CATEGORY PILLS
   ============================ */
.cb { padding: 36px 0; border-bottom: 1px solid var(--ln); overflow: hidden; z-index: 2; position: relative; }
.cb-in { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.cb-in::-webkit-scrollbar { display: none; }
.cp { flex-shrink: 0; padding: 11px 26px; border: 1px solid var(--ln2); border-radius: 50px; font-family: var(--ff-u); font-size: 12px; font-weight: 500; color: var(--tx2); transition: all .3s cubic-bezier(.16,1,.3,1); cursor: pointer; white-space: nowrap; position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: 6px; }
.cp::before { content: ''; position: absolute; inset: 0; background: var(--fo); border-radius: 50px; transform: scaleX(0); transform-origin: left; transition: transform .4s cubic-bezier(.16,1,.3,1); z-index: 0; }
.cp:hover::before, .cp.on::before { transform: scaleX(1); }
.cp > * { position: relative; z-index: 1; transition: color .3s; }
.cp:hover > *, .cp.on > * { color: #faf8f3; }
.cp-c { font-family: var(--ff-m); font-size: 10px; opacity: .35; }

/* ============================
   CARDS
   ============================ */
.main-sec { padding: 56px 0; }
.card-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.card { background: var(--iv); border: 1px solid var(--ln); border-radius: var(--r-lg); overflow: hidden; transition: all .5s cubic-bezier(.16,1,.3,1); }
.card:hover { border-color: var(--ln2); box-shadow: 0 24px 56px rgba(26,58,42,.08); transform: translateY(-8px); }
.card-img { display: block; position: relative; overflow: hidden; aspect-ratio: 3/2; }
.card-img-inner { display: block; overflow: hidden; width: 100%; height: 100%; }
.card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.16,1,.3,1); }
.card:hover .card-img img { transform: scale(1.05); }
.card-badge { position: absolute; top: 14px; left: 14px; display: inline-block; padding: 5px 14px; border-radius: 50px; font-family: var(--ff-u); font-size: 10px; font-weight: 700; color: #fff; letter-spacing: .1em; text-transform: uppercase; background: var(--badge, var(--fo)); z-index: 2; backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.12); }
.card-body { padding: 24px; }
.card-title { font-family: var(--ff-h); font-size: 18px; font-weight: 700; line-height: 1.25; margin: 0 0 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; letter-spacing: -.015em; transition: color .2s; }
.card-title a { color: var(--ch); }
.card:hover .card-title a { color: var(--fo); }
.card-excerpt { font-family: var(--ff-b); font-size: 15px; color: var(--tx2); line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 0 0 14px; }
.card-foot { display: flex; gap: 16px; }
.card-foot .meta { font-size: 11px; }

/* ============================
   LOAD MORE
   ============================ */
.load-more { text-align: center; padding: 48px 0 16px; }
.load-btn { display: inline-flex; align-items: center; gap: 14px; padding: 20px 48px; border: 2px solid var(--ch); border-radius: 60px; font-family: var(--ff-u); font-size: 13px; font-weight: 700; color: var(--ch); background: transparent; cursor: pointer; letter-spacing: .05em; position: relative; overflow: hidden; transition: color .4s, border-color .4s; }
.load-btn::before { content: ''; position: absolute; inset: 0; background: var(--ch); border-radius: 60px; transform: scaleY(0); transform-origin: bottom; transition: transform .5s cubic-bezier(.16,1,.3,1); }
.load-btn:hover::before { transform: scaleY(1); }
.load-btn > * { position: relative; z-index: 1; }
.load-btn:hover { color: var(--cr); }
.load-btn:hover svg { stroke: var(--cr); }
.load-btn.loading { pointer-events: none; opacity: .7; }
.load-btn.load-done { pointer-events: none; opacity: .5; border-style: dashed; }
.load-btn.load-done::before { display: none; }
.load-spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid var(--ln2); border-top-color: var(--fo); border-radius: 50%; animation: loadSpin .6s linear infinite; }
@keyframes loadSpin { to { transform: rotate(360deg); } }

/* ============================
   PAGINATION
   ============================ */
.pag { display: flex; justify-content: center; gap: 6px; margin-top: 48px; font-family: var(--ff-u); }
.pag a, .pag span, .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--ln2); background: var(--iv); color: var(--tx2); font-weight: 600; font-size: 13px; transition: all .2s; }
.pag a:hover, .page-numbers:hover { background: var(--fo); color: #faf8f3; border-color: var(--fo); }
.pag .current, .page-numbers.current { background: var(--fo); color: #faf8f3; border-color: var(--fo); }

/* ============================
   REVEAL ANIMATIONS
   ============================ */
.rv { opacity: 0; transform: translateY(40px); transition: opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
.rv.v { opacity: 1; transform: none; }

/* ============================
   SIDEBAR
   ============================ */
.sidebar { position: sticky; top: 94px; }
.s-widget { background: var(--iv); border: 1px solid var(--ln); border-radius: 18px; padding: 24px; margin-bottom: 20px; }
.s-widget-title { font-family: var(--ff-u); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--tx3); margin: 0 0 18px; padding-bottom: 12px; border-bottom: 2px solid var(--fo); }
.s-cats { list-style: none; }
.s-cats li a { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--ln); font-family: var(--ff-u); font-size: 13px; font-weight: 500; color: var(--tx); transition: color .12s; }
.s-cats li:last-child a { border-bottom: none; }
.s-cats li a:hover { color: var(--fo); }
.s-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.s-name { flex: 1; }
.s-count { font-size: 11px; font-weight: 600; color: var(--tx3); background: var(--cr2); padding: 2px 10px; border-radius: 50px; }
.s-pop { list-style: none; counter-reset: pop; }
.s-pop li { counter-increment: pop; }
.s-pop li a { display: flex; gap: 14px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid var(--ln); color: inherit; }
.s-pop li:last-child a { border-bottom: none; }
.s-pop li a::before { content: counter(pop, decimal-leading-zero); font-family: var(--ff-h); font-size: 22px; font-weight: 700; color: var(--cr3); line-height: 1; min-width: 28px; transition: color .15s; }
.s-pop li:hover a::before { color: var(--fo); }
.s-pop-t { display: block; font-family: var(--ff-h); font-size: 14px; font-weight: 600; color: var(--ch); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.s-pop-d { display: block; font-family: var(--ff-m); font-size: 11px; color: var(--tx3); margin-top: 3px; }
.s-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { display: inline-block; padding: 5px 14px; border: 1px solid var(--ln2); border-radius: 50px; font-family: var(--ff-u); font-size: 12px; font-weight: 500; color: var(--tx2); transition: all .15s; }
.tag:hover { background: var(--cr2); color: var(--fo); border-color: var(--fo); }

/* ============================
   SINGLE
   ============================ */
.single-hdr { padding: 48px 0 28px; }
.crumb { font-family: var(--ff-u); font-size: 13px; color: var(--tx3); margin-bottom: 20px; }
.crumb a { color: var(--tx3); } .crumb a:hover { color: var(--fo); } .crumb span { margin: 0 5px; }
.single-title { font-family: var(--ff-h); font-size: clamp(28px, 4.5vw, 48px); font-weight: 700; line-height: 1.12; color: var(--ch); margin: 16px 0 18px; letter-spacing: -.035em; }
.single-meta { margin-bottom: 8px; }
.single-hero { margin-bottom: 36px; }
.single-fig { margin: 0; border-radius: var(--r-xl); overflow: hidden; box-shadow: 0 16px 48px rgba(26,58,42,.08); }
.single-fig img { width: 100%; max-height: 540px; object-fit: cover; }
.single-fig figcaption { text-align: center; font-family: var(--ff-u); font-size: 12px; color: var(--tx3); padding: 12px; }
.entry p { font-size: 18px; line-height: 1.9; color: var(--tx); margin-bottom: 1.6em; }
.entry h2 { font-size: 28px; margin: 2em 0 .7em; letter-spacing: -.02em; }
.entry h3 { font-size: 22px; margin: 1.8em 0 .6em; }
.entry h4 { font-size: 18px; margin: 1.5em 0 .5em; }
.entry a { color: var(--fo); border-bottom: 1px solid var(--go2); transition: border-color .12s; }
.entry a:hover { border-bottom-color: var(--fo); }
.entry blockquote { border-left: 4px solid var(--fo); background: var(--cr2); margin: 2em 0; padding: 24px 28px; border-radius: 0 14px 14px 0; font-style: italic; }
.entry blockquote p { color: var(--tx2); font-size: 17px; margin-bottom: .5em; }
.entry blockquote::before, .entry blockquote::after { display: none; }
.entry img { border-radius: 14px; margin: 1.5em 0; }
.entry pre { background: var(--ch); color: #e5e7eb; border-radius: 14px; padding: 24px; font-family: var(--ff-m); font-size: 14px; overflow-x: auto; margin: 1.5em 0; }
.entry ul, .entry ol { margin: 0 0 1.5em 1.5em; color: var(--tx); }
.entry li { margin-bottom: .5em; font-size: 17px; }
.entry table { width: 100%; border-collapse: collapse; margin: 1.5em 0; }
.entry th, .entry td { padding: 12px 16px; border: 1px solid var(--ln2); text-align: left; font-size: 15px; }
.entry th { background: var(--cr2); font-family: var(--ff-u); font-weight: 600; font-size: 13px; }
.single-tags { padding: 16px 0; } .tags { display: flex; flex-wrap: wrap; gap: 6px; }
.single-author { padding: 28px 0; }
.author-box { display: flex; gap: 20px; align-items: center; background: var(--iv); border: 1px solid var(--ln2); border-radius: 18px; padding: 28px; }
.author-av img { border-radius: 50%; width: 72px; height: 72px; object-fit: cover; }
.author-label { font-family: var(--ff-u); font-size: 11px; color: var(--tx3); text-transform: uppercase; letter-spacing: .08em; display: block; }
.author-name { font-family: var(--ff-h); font-size: 17px; color: var(--ch); display: block; margin: 2px 0 4px; }
.author-bio { font-size: 14px; color: var(--tx2); line-height: 1.6; margin: 0; }
.post-nav { padding: 28px 0; border-top: 1px solid var(--ln); }
.post-nav-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pn { display: block; padding: 22px; background: var(--iv); border: 1px solid var(--ln2); border-radius: 14px; transition: all .25s; color: inherit; }
.pn:hover { border-color: var(--fo); box-shadow: var(--shm); transform: translateY(-2px); }
.pn-next { text-align: right; }
.pn-dir { display: block; font-family: var(--ff-u); font-size: 12px; color: var(--tx3); margin-bottom: 4px; }
.pn-title { display: block; font-family: var(--ff-h); font-size: 15px; font-weight: 600; color: var(--ch); }
.related { padding: 56px 0; background: var(--cr2); border-top: 1px solid var(--ln); }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.arc-hdr { padding: 56px 0 44px; background: var(--iv); border-bottom: 1px solid var(--ln); text-align: center; }
.arc-title { font-family: var(--ff-h); font-size: clamp(28px, 4vw, 44px); font-weight: 700; margin: 12px 0 10px; letter-spacing: -.03em; }
.arc-desc { font-size: 16px; color: var(--tx2); max-width: 600px; margin: 0 auto 8px; }
.arc-count { font-family: var(--ff-u); font-size: 13px; color: var(--tx3); }
.empty { text-align: center; padding: 80px 0; color: var(--tx3); font-family: var(--ff-u); font-size: 16px; }

/* ============================
   COMMENTS
   ============================ */
.comments-sec { padding: 48px 0; border-top: 1px solid var(--ln); }
.comment-list { list-style: none; padding: 0; }
.c-item { margin-bottom: 16px; }
.c-body { display: flex; gap: 14px; background: var(--iv); border: 1px solid var(--ln); border-radius: 16px; padding: 22px; }
.c-avatar img { border-radius: 50%; width: 48px; height: 48px; }
.c-content { flex: 1; min-width: 0; }
.c-header { display: flex; gap: 12px; align-items: baseline; margin-bottom: 6px; }
.c-author { font-family: var(--ff-u); font-size: 14px; color: var(--ch); }
.c-date { font-family: var(--ff-m); font-size: 12px; color: var(--tx3); }
.c-text { font-size: 14px; line-height: 1.7; color: var(--tx); }
.c-text p { margin: 0 0 .5em; }
.comment-reply-link { font-family: var(--ff-u); font-size: 12px; font-weight: 600; color: var(--fo); }
.comment-form label { display: block; font-family: var(--ff-u); font-size: 13px; font-weight: 600; color: var(--tx2); margin-bottom: 6px; }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea { width: 100%; padding: 14px 18px; border: 1px solid var(--ln2); border-radius: 12px; font-family: var(--ff-u); font-size: 14px; color: var(--tx); background: var(--iv); transition: border-color .15s; outline: none; }
.comment-form input:focus, .comment-form textarea:focus { border-color: var(--fo); box-shadow: 0 0 0 3px var(--go2); }
.comment-form .form-submit input { margin-top: 12px; padding: 14px 28px; background: var(--fo); color: #faf8f3; border: none; border-radius: 50px; font-family: var(--ff-u); font-weight: 600; cursor: pointer; transition: all .2s; }
.comment-form .form-submit input:hover { background: var(--fo2); box-shadow: 0 4px 12px rgba(26,58,42,.15); }

/* ============================
   FOOTER
   ============================ */
.ftr-top { background: var(--ch); color: rgba(255,255,255,.4); padding: 64px 0; }
.ftr-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.4fr; gap: 40px; }
.ftr-logo { display: block; margin-bottom: 18px; }
.ftr-logo .logo-img { height: 36px; filter: brightness(10); }
.ftr-logo .logo-txt { color: rgba(255,255,255,.6); font-family: var(--ff-u); font-size: 11px; font-weight: 800; letter-spacing: .25em; }
.ftr-desc { font-family: var(--ff-b); font-size: 15px; line-height: 1.85; }
.ftr-title { font-family: var(--ff-u); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .2em; color: rgba(255,255,255,.2); margin: 0 0 24px; }
.f-title { font-family: var(--ff-u); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .2em; color: rgba(255,255,255,.2); margin: 0 0 16px; }
.f-widget { margin-bottom: 20px; }
.ftr-text { font-size: 14px; line-height: 1.7; }
.ftr-links { list-style: none; }
.ftr-links li { margin-bottom: 10px; }
.ftr-links a { font-family: var(--ff-u); font-size: 14px; color: rgba(255,255,255,.4); transition: all .15s; display: inline-block; }
.ftr-links a:hover { color: #c8a44e; transform: translateX(4px); }
.ftr-recent { list-style: none; }
.ftr-recent li a { display: flex; gap: 12px; padding: 8px 0; align-items: center; color: inherit; border-bottom: 1px solid rgba(255,255,255,.04); transition: all .12s; }
.ftr-recent li:last-child a { border-bottom: none; }
.ftr-recent li a:hover { transform: translateX(3px); }
.ftr-rimg { flex-shrink: 0; width: 48px; height: 48px; border-radius: 10px; overflow: hidden; }
.ftr-rimg img { width: 100%; height: 100%; object-fit: cover; }
.ftr-rtitle { display: block; font-family: var(--ff-h); font-size: 13px; font-weight: 600; color: rgba(255,255,255,.5); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ftr-rdate { display: block; font-family: var(--ff-m); font-size: 11px; color: rgba(255,255,255,.25); margin-top: 2px; }
.ftr-bottom { background: #141614; padding: 20px 0; }
.ftr-bar { display: flex; justify-content: space-between; align-items: center; font-family: var(--ff-m); font-size: 11px; color: rgba(255,255,255,.15); }
.ftr-count { opacity: .6; }

/* ============================
   RESPONSIVE
   ============================ */
@media (max-width: 1024px) {
    .layout { grid-template-columns: 1fr; }
    .sidebar { position: static; }
    .ftr-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
    .related-grid { grid-template-columns: 1fr 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .wrap { padding: 0 20px; }
    .hero-grid { grid-template-columns: 1fr; gap: 28px; }
    .hero-img img { height: 280px; }
    .strip-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
    .card-grid { grid-template-columns: 1fr; }
    .related-grid { grid-template-columns: 1fr; }
    .post-nav-grid { grid-template-columns: 1fr; }
    .ftr-grid { grid-template-columns: 1fr; }
    .hdr-burger { display: flex; }
    .hdr-search { display: none; }
    .nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--iv); border-bottom: 1px solid var(--ln2); box-shadow: 0 16px 48px rgba(26,58,42,.06); padding: 16px; z-index: 99; }
    .nav.open { display: block; }
    .nav-list { flex-direction: column; gap: 0; }
    .nav-list > li > a { padding: 12px 16px; font-size: 14px; }
    .nav-list .sub-menu { position: static; box-shadow: none; border: none; padding-left: 16px; display: block; }
    .ftr-bar { flex-direction: column; gap: 6px; text-align: center; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .st { padding: 36px 16px; }
    .st-n { font-size: 44px; }
    .ttog { bottom: 16px; right: 16px; width: 44px; height: 44px; }
    .mrq-i { font-size: 36px; }
    .tk { height: 36px; max-height: 36px; }
    .tk-t, .tk-i { height: 36px; line-height: 36px; }
    .tk-i { padding: 0 28px; }
}
@media (max-width: 480px) {
    .wrap { padding: 0 16px; }
    .hero-title { font-size: 26px; }
    .single-title { font-size: 26px; }
    .entry p { font-size: 16px; line-height: 1.8; }
    .strip-grid { grid-template-columns: 1fr; }
}

@media print {
    .hdr, .ftr-top, .ftr-bottom, .sidebar, .strip, .pag, .single-author, .post-nav, .related, .comments-sec, .sp, .mgrad, .ttog, .mrq, .stats-sec, .cb, .load-more, .tk { display: none !important; }
    body { background: #fff; color: #000; font-size: 12pt; }
    body::after { display: none; }
    .entry a { color: #000; text-decoration: underline; }
}