/*
Theme Name: Vibe Leo Editorial Platform
Theme URI: https://vibeleo.com/
Author: Vibe Leo
Description: Distinctive editorial music platform for Vibe Leo.
Version: 1.0.0
Text Domain: vibeleo-editorial
*/
:root{--vl-bg:#f7f5ed;--vl-white:#fff;--vl-ink:#18362c;--vl-green:#153f32;--vl-gold:#d5b25d;--vl-muted:#778179;--vl-line:#e7e7da;--vl-radius:19px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.vibeleo-editorial{margin:0;background:var(--vl-bg);color:var(--vl-ink);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto}
button,input{font:inherit}
.vl-header{background:#fff;border-bottom:1px solid var(--vl-line);position:sticky;top:0;z-index:100}
.vl-header-inner{max-width:1640px;margin:auto;padding:13px 27px;display:flex;align-items:center;gap:35px}
.vl-logo{display:flex;align-items:center;gap:12px;min-width:218px}
.vl-logo-mark{background:var(--vl-green);color:#fff;font-size:22px;font-weight:900;letter-spacing:-3px;padding:10px 13px;border-radius:13px;line-height:1}
.vl-logo-mark span{color:var(--vl-gold);font-size:11px;vertical-align:top;letter-spacing:0}
.vl-logo-text{font-size:21px;letter-spacing:-1px;font-weight:900;line-height:1}
.vl-logo-text b{color:#b08a3e}
.vl-logo-text small{display:block;font-size:9px;letter-spacing:2.1px;margin-top:7px;color:var(--vl-muted)}
.vl-search{display:flex;flex:1;max-width:570px;border:1px solid var(--vl-line);border-radius:30px;overflow:hidden;background:#f9f9f5}
.vl-search input{min-width:0;flex:1;padding:12px 20px;border:0;outline:0;background:transparent;font-size:13px}
.vl-search button{background:var(--vl-green);color:white;border:0;padding:0 24px;cursor:pointer;font-weight:700}
.vl-header-link{margin-left:auto;font-size:13px;font-weight:800}
.vl-mobile-toggle{display:none}
.vl-app-shell{max-width:1640px;margin:auto;display:grid;grid-template-columns:225px minmax(0,1fr)}
.vl-sidebar{border-right:1px solid var(--vl-line);padding:33px 19px;min-height:calc(100vh - 78px)}
.vl-side-label,.vl-eyebrow{color:#a18548;font-size:10px;font-weight:900;letter-spacing:2px}
.vl-side-nav{display:grid;gap:7px;margin-top:20px}
.vl-side-nav a{padding:12px 13px;display:flex;gap:15px;align-items:center;border-radius:12px;font-size:13px;font-weight:750}
.vl-side-nav a:hover,.vl-side-nav a:focus{background:#e6ebdc}
.vl-side-nav a>span:first-child{font-size:20px;color:#b29454;width:23px;text-align:center}
.vl-side-promo{margin-top:75px;background:#1c4838;color:#fff;border-radius:17px;padding:22px 18px;overflow:hidden}
.vl-side-promo>span{font-size:9px;letter-spacing:1.3px;color:#e4c879}
.vl-side-promo strong{display:block;font-size:21px;line-height:1.18;margin-top:15px}
.vl-side-promo p{font-size:12px;color:#d6e5d9}
.vl-main{min-width:0}
.vl-home{padding:28px 35px 45px}
.vl-hero{position:relative;display:grid;grid-template-columns:1fr 40%;gap:18px;align-items:center;min-height:335px;background:#e7e5d4;border-radius:23px;overflow:hidden;padding:35px 45px}
.vl-hero-copy{position:relative;z-index:2}
.vl-hero h1{font-size:clamp(30px,4vw,57px);letter-spacing:-2px;line-height:1.07;margin:15px 0;max-width:580px}
.vl-hero p{font-size:14px;color:#5c6c61;max-width:420px}
.vl-primary-button{display:inline-flex;gap:25px;align-items:center;background:var(--vl-green);color:#fff;border-radius:30px;padding:13px 21px;margin-top:20px;font-weight:800;font-size:13px}
.vl-primary-button span{color:#ebd188}
.vl-hero-art{display:block;max-width:340px;width:100%;justify-self:center;aspect-ratio:1;position:relative;z-index:2;transform:rotate(5deg);box-shadow:14px 18px 0 #cfcaac}
.vl-hero-art img{width:100%;height:100%;object-fit:cover}
.vl-hero-decoration{position:absolute;bottom:-25px;right:15px;font-size:82px;line-height:.83;font-weight:900;color:#d6d3bc;letter-spacing:-5px}
.vl-section{margin-top:43px}
.vl-section-heading{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:19px}
.vl-section h2{font-size:25px;letter-spacing:-1px;margin:5px 0 0}
.vl-section-subtitle{color:var(--vl-muted);font-size:12px}
.vl-categories{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.vl-category-tile{background:#fff;border:1px solid var(--vl-line);border-radius:15px;min-height:116px;padding:17px;display:flex;flex-direction:column;align-items:start;transition:transform .2s}
.vl-category-tile:hover,.vl-release-card:hover{transform:translateY(-3px)}
.vl-category-tile>span{font-size:27px;color:#a5894c}
.vl-category-tile strong{font-size:13px;margin-top:8px}
.vl-category-tile small{font-size:10px;color:var(--vl-muted)}
.vl-release-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.vl-release-card{min-width:0;transition:transform .2s}
.vl-release-cover{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:15px;background:#e3e7da}
.vl-release-cover img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
.vl-release-cover:hover img{transform:scale(1.05)}
.vl-art-fallback{display:grid;place-items:center;height:100%;background:#244c3b;color:#e9d39b;font-size:23px;font-weight:900;text-align:center}
.vl-card-play{position:absolute;right:12px;bottom:12px;background:#fff;color:var(--vl-green);border-radius:50%;width:37px;height:37px;display:grid;place-items:center;font-size:12px}
.vl-release-details{padding:11px 3px}
.vl-release-category{font-size:10px;text-transform:uppercase;letter-spacing:1px;font-weight:800;color:#a3894b}
.vl-release-details h3{font-size:14px;line-height:1.35;margin:5px 0;overflow-wrap:anywhere}
.vl-release-details time{font-size:11px;color:var(--vl-muted)}
.vl-bottom-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:35px}
.vl-compact-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.vl-trending{background:#fff;border:1px solid var(--vl-line);border-radius:17px;padding:9px 18px}
.vl-trending-row{display:grid;grid-template-columns:27px 1fr 20px;align-items:center;gap:12px;border-bottom:1px solid var(--vl-line);padding:14px 0;font-size:12px}
.vl-trending-row:last-child{border:0}
.vl-trending-row>span:first-child{color:#b79a59;font-size:17px;font-weight:900}
.vl-trending-row strong{overflow-wrap:anywhere}
.vl-pagination{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
.vl-pagination .page-numbers{padding:9px 14px;background:#fff;border-radius:8px}
.vl-pagination .current{background:var(--vl-green);color:#fff}
.vl-footer{border-top:1px solid var(--vl-line);margin-top:50px;padding:35px;display:flex;gap:20px;justify-content:space-between;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--vl-muted)}
.vl-footer strong{display:block;font-size:20px;color:var(--vl-green)}
.vl-footer nav{display:flex;gap:15px}
.vl-footer span{display:block}
.vl-mobile-toggle{border:0;background:var(--vl-green);color:#fff;border-radius:9px;padding:9px 12px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
/* Legacy template compatibility */
.wrap{width:min(1120px,calc(100% - 40px));margin:auto}
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:25px;margin:30px auto}
.single-card,.page-card,.widget{background:#fff;border:1px solid var(--vl-line);border-radius:16px;padding:24px;min-width:0}
.single-title,.page-title{font-size:clamp(25px,3vw,39px);line-height:1.2}
.featured img{max-width:100%;height:auto;border-radius:13px}
.entry-content{overflow-wrap:anywhere}
.entry-content img{max-width:100%;height:auto}
.entry-content a{color:#13634a;text-decoration:underline}
.audio-box{padding:18px;border:1px solid var(--vl-line);border-radius:15px;margin:22px 0;background:#f8faf5}
.audio-controls{display:flex;gap:10px;align-items:center}
.audio-play{background:var(--vl-green);color:#fff;border:0;border-radius:50%;width:48px;height:48px;cursor:pointer}
.audio-range{width:100%;accent-color:var(--vl-green)}
.audio-download-row .download{display:inline-block;background:var(--vl-green);color:#fff;padding:12px 18px;border-radius:9px;margin-top:12px}
.related-grid,.post-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.post-card,.related-card{background:#fff;border:1px solid var(--vl-line);padding:13px;border-radius:12px}
.post-card img,.related-card img{max-width:100%;height:auto}
.post-title{font-size:17px}
.site-footer{background:var(--vl-green);color:#fff}
@media(max-width:1150px){
.vl-categories{grid-template-columns:repeat(3,1fr)}
.vl-release-grid{grid-template-columns:repeat(3,1fr)}
.vl-bottom-grid{grid-template-columns:1fr}
}
@media(max-width:850px){
.vl-header-inner{padding:12px 16px;gap:12px;flex-wrap:wrap}
.vl-logo{min-width:0}
.vl-logo-text{font-size:17px}
.vl-search{order:3;flex-basis:100%;max-width:none}
.vl-header-link{display:none}
.vl-mobile-toggle{display:block;margin-left:auto}
.vl-app-shell{display:block}
.vl-sidebar{display:none;min-height:0;padding:15px;border-bottom:1px solid var(--vl-line)}
.vl-sidebar.is-open{display:block}
.vl-side-promo{display:none}
.vl-home{padding:18px}
.vl-hero{padding:25px;min-height:0}
.vl-release-grid{grid-template-columns:repeat(3,1fr)}
.content-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
.vl-hero{grid-template-columns:1fr;gap:20px}
.vl-hero h1{font-size:34px}
.vl-hero-art{max-width:200px;justify-self:start}
.vl-hero-decoration{font-size:49px}
.vl-categories{grid-template-columns:repeat(2,1fr)}
.vl-release-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.vl-compact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.vl-section h2{font-size:22px}
.vl-section-subtitle{display:none}
.vl-footer{padding:25px 18px}
}

/* VL.5A compatibility refinements */
body.vibeleo-editorial .single,
body.vibeleo-editorial .page-wrap {padding-top:25px;padding-bottom:45px}
body.vibeleo-editorial .single-card,
body.vibeleo-editorial .page-card {box-shadow:0 10px 35px rgba(24,54,44,.035)}
body.vibeleo-editorial .audio-box-modern {display:flex;flex-wrap:wrap;gap:18px;align-items:center}
body.vibeleo-editorial .audio-cover-wrap {width:115px;flex-shrink:0}
body.vibeleo-editorial .audio-cover {width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px}
body.vibeleo-editorial .audio-main {flex:1;min-width:190px}
body.vibeleo-editorial .audio-download-row {width:100%}
body.vibeleo-editorial .audio-info-modern strong {display:block;font-size:18px}
body.vibeleo-editorial .audio-info-modern span {font-size:12px;color:var(--vl-muted)}
body.vibeleo-editorial .audio-time {display:flex;justify-content:space-between;font-size:11px}
body.vibeleo-editorial .audio-volume {display:flex;align-items:center;gap:5px;flex-wrap:wrap}
body.vibeleo-editorial .volume-levels {display:flex;align-items:end;gap:3px}
body.vibeleo-editorial .volume-bar {width:7px;height:19px;border:0;border-radius:3px;background:#cbd8cf;cursor:pointer}
body.vibeleo-editorial .volume-bar.is-active {background:var(--vl-green)}
body.vibeleo-editorial .audio-side,
body.vibeleo-editorial .volume-step,
body.vibeleo-editorial .volume-speaker {border:1px solid var(--vl-line);background:white;border-radius:8px;padding:7px;cursor:pointer}
body.vibeleo-editorial .post-tags,
body.vibeleo-editorial .share {display:flex;gap:9px;flex-wrap:wrap;margin:20px 0}
body.vibeleo-editorial .post-tags a,
body.vibeleo-editorial .share a,
body.vibeleo-editorial .share button {border:1px solid var(--vl-line);padding:8px 11px;border-radius:8px}
body.vibeleo-editorial .widget {margin-bottom:18px}
body.vibeleo-editorial .top-list {display:grid;gap:12px}
body.vibeleo-editorial .top-item {display:flex;gap:10px;align-items:center}
body.vibeleo-editorial .top-thumb {width:55px;height:55px;flex-shrink:0}
body.vibeleo-editorial .top-thumb img {width:100%;height:100%;object-fit:cover;border-radius:8px}
body.vibeleo-editorial .contact-form input,
body.vibeleo-editorial .contact-form select,
body.vibeleo-editorial .contact-form textarea {max-width:100%;padding:11px;border:1px solid var(--vl-line);border-radius:8px}
body.vibeleo-editorial .contact-form label {display:block;margin-bottom:14px}
body.vibeleo-editorial .contact-submit {background:var(--vl-green);color:white;border:0;border-radius:8px;padding:12px 20px}
@media(max-width:600px){
body.vibeleo-editorial .audio-box-modern {display:block}
body.vibeleo-editorial .audio-cover-wrap {margin-bottom:14px}
body.vibeleo-editorial .single-card,
body.vibeleo-editorial .page-card {padding:16px}
}