/*
Theme Name: SpillPH Premium
Description: Modern viral news & media WordPress theme with dedicated SpillPH Options admin panel and layout presets.
Version: 6.0.23
Author: SpillPH
Text Domain: spillph
*/

:root{
 --accent:#ff2b2b;
 --dark:#0b0b0c;
 --surface:#ffffff;
 --bg:#f3f4f6;
 --muted:#666;
 --radius:24px;
 --shadow:0 12px 40px rgba(0,0,0,.08);
 --header-bg:rgba(11,11,12,.92);
 --footer-bg:#0b0b0c;
 --body-font:Inter,Arial,sans-serif;
 --heading-font:Inter,Arial,sans-serif;
}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:#111;font-family:var(--body-font)}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.breaking-bar{background:var(--accent);color:#fff;padding:10px 18px;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;overflow:hidden;white-space:nowrap}
.breaking-bar.is-hidden{display:none}
.site-header{position:sticky;top:0;z-index:999;background:var(--header-bg);backdrop-filter:blur(12px);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.header-inner{max-width:1280px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:18px 20px;gap:20px}
.logo{font-family:var(--heading-font);font-size:42px;font-weight:900;letter-spacing:-3px}
.logo span{color:var(--accent)}
.nav ul{display:flex;list-style:none;gap:18px;margin:0;padding:0;flex-wrap:wrap}
.nav a{color:#fff;font-size:13px;font-weight:800;text-transform:uppercase}
.main{max-width:1280px;margin:auto;padding:24px 20px 80px}
.hero-grid{display:grid;grid-template-columns:2fr 1fr;gap:20px}
.hero-main{position:relative;overflow:hidden;border-radius:32px;min-height:560px;background:#111;box-shadow:var(--shadow)}
.hero-main img{width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.88),rgba(0,0,0,.1));display:flex;align-items:flex-end;padding:36px}
.hero-content h1{font-family:var(--heading-font);color:#fff;font-size:clamp(40px,5vw,78px);line-height:.92;margin:10px 0;letter-spacing:-4px}
.hero-content p{color:#ddd;font-size:18px;max-width:720px}
.hero-side{display:grid;gap:20px}
.side-card{background:#fff;border-radius:28px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.side-card-content{padding:18px}
.badge{display:inline-block;background:rgba(255,43,43,.12);color:var(--accent);padding:8px 12px;border-radius:999px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.section{margin-top:42px}
.section-header{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}
.section-title{font-family:var(--heading-font);font-size:36px;font-weight:900;letter-spacing:-2px;margin:0}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.news-card{background:#fff;border-radius:24px;overflow:hidden;box-shadow:var(--shadow);transition:.25s ease}
.news-card:hover{transform:translateY(-4px)}
.news-thumb{aspect-ratio:16/10;background:linear-gradient(135deg,#111,var(--accent));display:grid;place-items:center;color:#fff;font-weight:900}
.news-thumb img{width:100%;height:100%;object-fit:cover}
.news-body{padding:18px}
.news-title{font-family:var(--heading-font);font-size:24px;line-height:1.05;letter-spacing:-1px;margin:8px 0;font-weight:900}
.news-meta{color:var(--accent);font-size:12px;text-transform:uppercase;font-weight:800}
.sidebar-layout{display:grid;grid-template-columns:1fr 320px;gap:24px;margin-top:32px}
.trending-box{background:#fff;border-radius:24px;padding:20px;box-shadow:var(--shadow);position:sticky;top:100px}
.trending-title{font-family:var(--heading-font);margin-top:0;font-size:24px;letter-spacing:-1px}
.trending-list{padding-left:18px}.trending-list li{margin:14px 0;font-weight:700}
.ad-slot{background:#fff;border:2px dashed #ddd;border-radius:20px;padding:18px;text-align:center;color:#777;font-weight:700;margin:24px 0}
.single-wrap{max-width:900px;margin:auto;background:#fff;padding:40px;border-radius:32px;box-shadow:var(--shadow)}
.single-wrap h1{font-family:var(--heading-font);font-size:clamp(44px,6vw,84px);line-height:.92;letter-spacing:-4px}
.article-content{font-size:18px;line-height:1.8}
.site-footer{background:var(--footer-bg);color:#fff;margin-top:80px;padding:50px 20px}
.footer-inner{max-width:1280px;margin:auto}
.footer-inner h2{font-family:var(--heading-font);font-size:34px;margin:0 0 8px}
body.spillph-dark{--bg:#111;--surface:#171717;color:#f4f4f5}
body.spillph-dark .news-card,body.spillph-dark .side-card,body.spillph-dark .trending-box,body.spillph-dark .single-wrap,body.spillph-dark .ad-slot{background:#1c1c1f;color:#f4f4f5;border-color:#333}
body.spillph-dark .news-card p{color:#bbb}
@media(max-width:1000px){.hero-grid,.sidebar-layout,.news-grid{grid-template-columns:1fr}.hero-main{min-height:420px}.hero-content h1{font-size:48px}}
@media(max-width:700px){.header-inner{align-items:flex-start;flex-direction:column}.logo{font-size:34px}.hero-overlay{padding:24px}.section-title{font-size:28px}.single-wrap{padding:24px}}


/* ================================
   SpillPH Layout Presets v2.2.0
================================ */

/* Default / Hybrid News Viral */
body.spillph-layout-hybrid_news_viral .hero-grid{grid-template-columns:2fr 1fr}
body.spillph-layout-hybrid_news_viral .news-grid{grid-template-columns:repeat(3,1fr)}

/* Modern Viral Layout */
body.spillph-layout-modern_viral{--bg:#f8f8fb}
body.spillph-layout-modern_viral .hero-main{min-height:640px;border-radius:38px}
body.spillph-layout-modern_viral .hero-content h1{font-size:clamp(48px,6vw,92px)}
body.spillph-layout-modern_viral .news-grid{grid-template-columns:repeat(3,1fr)}
body.spillph-layout-modern_viral .news-card{border-radius:30px}
body.spillph-layout-modern_viral .news-title{font-size:26px}

/* Professional News Layout */
body.spillph-layout-professional_news{--bg:#f5f5f2;--radius:12px}
body.spillph-layout-professional_news .breaking-bar{background:#111}
body.spillph-layout-professional_news .hero-grid{grid-template-columns:1.4fr 1fr}
body.spillph-layout-professional_news .hero-main,
body.spillph-layout-professional_news .side-card,
body.spillph-layout-professional_news .news-card,
body.spillph-layout-professional_news .trending-box,
body.spillph-layout-professional_news .single-wrap{border-radius:10px;box-shadow:none;border:1px solid #ddd}
body.spillph-layout-professional_news .hero-main{min-height:460px}
body.spillph-layout-professional_news .hero-content h1{font-size:clamp(34px,4vw,58px);letter-spacing:-2px}
body.spillph-layout-professional_news .news-grid{grid-template-columns:repeat(2,1fr)}
body.spillph-layout-professional_news .news-card{display:grid;grid-template-columns:180px 1fr}
body.spillph-layout-professional_news .news-thumb{aspect-ratio:auto;min-height:140px}
body.spillph-layout-professional_news .news-title{font-size:20px}

/* Magazine Layout */
body.spillph-layout-magazine{--bg:#faf7f1}
body.spillph-layout-magazine .site-header{position:relative}
body.spillph-layout-magazine .header-inner{flex-direction:column;gap:12px}
body.spillph-layout-magazine .logo{font-size:54px}
body.spillph-layout-magazine .hero-grid{grid-template-columns:1fr}
body.spillph-layout-magazine .hero-main{min-height:700px;border-radius:0}
body.spillph-layout-magazine .hero-content{max-width:850px}
body.spillph-layout-magazine .hero-content h1{font-size:clamp(52px,7vw,104px)}
body.spillph-layout-magazine .news-grid{grid-template-columns:repeat(3,1fr)}
body.spillph-layout-magazine .news-card{border-radius:0;box-shadow:none;border-bottom:4px solid var(--accent)}
body.spillph-layout-magazine .news-title{font-size:28px}

/* Compact Newspaper Layout */
body.spillph-layout-compact_newspaper{--bg:#fff}
body.spillph-layout-compact_newspaper .main{max-width:1180px}
body.spillph-layout-compact_newspaper .hero-grid{grid-template-columns:1fr 1fr}
body.spillph-layout-compact_newspaper .hero-main{min-height:420px;border-radius:0;box-shadow:none}
body.spillph-layout-compact_newspaper .side-card,
body.spillph-layout-compact_newspaper .news-card,
body.spillph-layout-compact_newspaper .trending-box{border-radius:0;box-shadow:none;border-top:3px solid #111}
body.spillph-layout-compact_newspaper .news-grid{grid-template-columns:repeat(4,1fr);gap:14px}
body.spillph-layout-compact_newspaper .news-title{font-size:18px;letter-spacing:-.4px}

/* Homepage Style Controls */
body.spillph-homepage-fullwidth_hero .hero-grid{grid-template-columns:1fr}
body.spillph-homepage-fullwidth_hero .hero-side{grid-template-columns:repeat(2,1fr)}
body.spillph-homepage-grid_focus .hero-grid{grid-template-columns:1fr}
body.spillph-homepage-grid_focus .hero-side{display:grid;grid-template-columns:repeat(2,1fr)}
body.spillph-homepage-magazine_stack .hero-grid{grid-template-columns:1fr}
body.spillph-homepage-magazine_stack .hero-main{min-height:620px}
body.spillph-homepage-magazine_stack .hero-side{grid-template-columns:repeat(2,1fr)}

/* Article Layout */
body.spillph-article-fullwidth .single-wrap{max-width:1180px}
body.spillph-article-reading_mode .single-wrap{max-width:760px}
body.spillph-article-reading_mode .article-content{font-size:20px;line-height:1.95}

/* Header Layout */
body.spillph-header-centered .header-inner{flex-direction:column;gap:14px}
body.spillph-header-centered .logo{font-size:52px}
body.spillph-header-classic .site-header{position:relative;backdrop-filter:none}
body.spillph-header-classic .header-inner{align-items:center}
body.spillph-header-transparent .site-header{background:rgba(0,0,0,.45)}

/* Category/Card Layout */
body.spillph-card-list .news-grid{grid-template-columns:1fr}
body.spillph-card-list .news-card{display:grid;grid-template-columns:260px 1fr}
body.spillph-card-list .news-thumb{aspect-ratio:auto;min-height:170px}
body.spillph-card-mixed .news-grid .news-card:first-child{grid-column:span 2}
body.spillph-card-mixed .news-grid .news-card:first-child .news-title{font-size:34px}

@media(max-width:1000px){
 body.spillph-layout-professional_news .news-card,
 body.spillph-card-list .news-card{display:block;grid-template-columns:1fr}
 body.spillph-layout-compact_newspaper .news-grid{grid-template-columns:1fr}
 body.spillph-homepage-fullwidth_hero .hero-side,
 body.spillph-homepage-grid_focus .hero-side,
 body.spillph-homepage-magazine_stack .hero-side{grid-template-columns:1fr}
}


/* v2.3.0 stronger visual differences */

body:not(.logged-in) 

/* Make each layout obviously different */
body.spillph-layout-modern_viral .breaking-bar{background:linear-gradient(90deg,#ff2b2b,#ff7a00)}
body.spillph-layout-modern_viral .site-header{background:rgba(16,16,24,.92)}
body.spillph-layout-modern_viral .hero-main{border:4px solid #ff2b2b}

body.spillph-layout-professional_news .site-header{background:#fff;color:#111}
body.spillph-layout-professional_news .nav a{color:#111}
body.spillph-layout-professional_news .logo{color:#111}
body.spillph-layout-professional_news .hero-overlay{background:linear-gradient(to top,rgba(0,0,0,.78),rgba(0,0,0,.15))}

body.spillph-layout-magazine .breaking-bar{background:#111}
body.spillph-layout-magazine .site-header{background:#fff;color:#111}
body.spillph-layout-magazine .nav a{color:#111}
body.spillph-layout-magazine .logo{color:#111}
body.spillph-layout-magazine .main{max-width:1400px}

body.spillph-layout-compact_newspaper .breaking-bar{background:#222}
body.spillph-layout-compact_newspaper .site-header{background:#fff;color:#111;border-bottom:3px solid #111}
body.spillph-layout-compact_newspaper .nav a{color:#111}
body.spillph-layout-compact_newspaper .logo{color:#111}


/* SpillPH v2.7.0 Typography Hooks */
.logo{color:var(--sp-site-title-header-color,#fff);font-family:var(--sp-site-title-header-font,var(--heading-font));font-size:var(--sp-site-title-header-size,42px);font-weight:var(--sp-site-title-header-weight,900);font-style:var(--sp-site-title-header-style,normal);text-decoration:var(--sp-site-title-header-decoration,none);letter-spacing:var(--sp-site-title-header-letter-spacing,-3px)}
.nav a{color:var(--sp-main-navigation-color,#fff);font-family:var(--sp-main-navigation-font,var(--body-font));font-size:var(--sp-main-navigation-size,13px);font-weight:var(--sp-main-navigation-weight,800);font-style:var(--sp-main-navigation-style,normal);text-decoration:var(--sp-main-navigation-decoration,none);letter-spacing:var(--sp-main-navigation-letter-spacing,0)}
.sp-header-tagline{color:var(--sp-tagline-header-color,#fff);font-family:var(--sp-tagline-header-font,var(--body-font));font-size:var(--sp-tagline-header-size,12px);font-weight:var(--sp-tagline-header-weight,800);font-style:var(--sp-tagline-header-style,normal);text-decoration:var(--sp-tagline-header-decoration,none);letter-spacing:var(--sp-tagline-header-letter-spacing,0);margin-bottom:6px}
.breaking-bar{color:var(--sp-breaking-news-label-color,#fff);font-family:var(--sp-breaking-news-label-font,var(--body-font));font-size:var(--sp-breaking-news-label-size,13px);font-weight:var(--sp-breaking-news-label-weight,800);font-style:var(--sp-breaking-news-label-style,normal);text-decoration:var(--sp-breaking-news-label-decoration,none);letter-spacing:var(--sp-breaking-news-label-letter-spacing,.08em)}
.hero-content h1{color:var(--sp-slider-post-title-color,#fff);font-family:var(--sp-slider-post-title-font,var(--heading-font));font-size:var(--sp-slider-post-title-size,clamp(40px,5vw,78px));font-weight:var(--sp-slider-post-title-weight,900);font-style:var(--sp-slider-post-title-style,normal);text-decoration:var(--sp-slider-post-title-decoration,none);letter-spacing:var(--sp-slider-post-title-letter-spacing,-4px)}
.side-card .news-title{color:var(--sp-grid-slider-post-title-color,#111);font-family:var(--sp-grid-slider-post-title-font,var(--heading-font));font-size:var(--sp-grid-slider-post-title-size,24px);font-weight:var(--sp-grid-slider-post-title-weight,900);font-style:var(--sp-grid-slider-post-title-style,normal);text-decoration:var(--sp-grid-slider-post-title-decoration,none);letter-spacing:var(--sp-grid-slider-post-title-letter-spacing,-1px)}
.section-title{color:var(--sp-blocks-titles-color,#111);font-family:var(--sp-blocks-titles-font,var(--heading-font));font-size:var(--sp-blocks-titles-size,36px);font-weight:var(--sp-blocks-titles-weight,900);font-style:var(--sp-blocks-titles-style,normal);text-decoration:var(--sp-blocks-titles-decoration,none);letter-spacing:var(--sp-blocks-titles-letter-spacing,-2px)}
.news-title{color:var(--sp-post-title-homepage-color,#111);font-family:var(--sp-post-title-homepage-font,var(--heading-font));font-size:var(--sp-post-title-homepage-size,24px);font-weight:var(--sp-post-title-homepage-weight,900);font-style:var(--sp-post-title-homepage-style,normal);text-decoration:var(--sp-post-title-homepage-decoration,none);letter-spacing:var(--sp-post-title-homepage-letter-spacing,-1px)}
.news-meta{color:var(--sp-post-meta-color,var(--accent));font-family:var(--sp-post-meta-font,var(--body-font));font-size:var(--sp-post-meta-size,12px);font-weight:var(--sp-post-meta-weight,800);font-style:var(--sp-post-meta-style,normal);text-decoration:var(--sp-post-meta-decoration,none);letter-spacing:var(--sp-post-meta-letter-spacing,.04em)}
.single-wrap h1{color:var(--sp-single-post-title-color,#111);font-family:var(--sp-single-post-title-font,var(--heading-font));font-size:var(--sp-single-post-title-size,64px);font-weight:var(--sp-single-post-title-weight,900);font-style:var(--sp-single-post-title-style,normal);text-decoration:var(--sp-single-post-title-decoration,none);letter-spacing:var(--sp-single-post-title-letter-spacing,-4px)}
.article-content{color:var(--sp-post-entry-color,#111);font-family:var(--sp-post-entry-font,var(--body-font));font-size:var(--sp-post-entry-size,18px);font-weight:var(--sp-post-entry-weight,400);font-style:var(--sp-post-entry-style,normal);text-decoration:var(--sp-post-entry-decoration,none);letter-spacing:var(--sp-post-entry-letter-spacing,0)}
blockquote,.article-content blockquote{color:var(--sp-blockquotes-color,#333);font-family:var(--sp-blockquotes-font,var(--heading-font));font-size:var(--sp-blockquotes-size,22px);font-weight:var(--sp-blockquotes-weight,700);font-style:var(--sp-blockquotes-style,italic);text-decoration:var(--sp-blockquotes-decoration,none);letter-spacing:var(--sp-blockquotes-letter-spacing,0);border-left:4px solid var(--accent);padding-left:18px}
.trending-title,.widget-title{color:var(--sp-widgets-titles-color,#111);font-family:var(--sp-widgets-titles-font,var(--heading-font));font-size:var(--sp-widgets-titles-size,24px);font-weight:var(--sp-widgets-titles-weight,900);font-style:var(--sp-widgets-titles-style,normal);text-decoration:var(--sp-widgets-titles-decoration,none);letter-spacing:var(--sp-widgets-titles-letter-spacing,-1px)}
.footer-inner h2{color:var(--sp-footer-widgets-titles-color,#fff);font-family:var(--sp-footer-widgets-titles-font,var(--heading-font));font-size:var(--sp-footer-widgets-titles-size,34px);font-weight:var(--sp-footer-widgets-titles-weight,900);font-style:var(--sp-footer-widgets-titles-style,normal);text-decoration:var(--sp-footer-widgets-titles-decoration,none);letter-spacing:var(--sp-footer-widgets-titles-letter-spacing,-1px)}
body{color:var(--sp-general-typography-color,#111);font-family:var(--sp-general-typography-font,var(--body-font));font-size:var(--sp-general-typography-size,16px);font-weight:var(--sp-general-typography-weight,400);font-style:var(--sp-general-typography-style,normal);text-decoration:var(--sp-general-typography-decoration,none);letter-spacing:var(--sp-general-typography-letter-spacing,0)}
body.spillph-dark .news-title,body.spillph-dark .section-title,body.spillph-dark .side-card .news-title,body.spillph-dark .single-wrap h1,body.spillph-dark .article-content,body.spillph-dark .trending-title{color:#f4f4f5}


/* SpillPH v2.8.0 Header Builder */
.sp-top-menu{
 background:#070707;
 color:#fff;
 font-family:var(--sp-top-menu-font,var(--body-font));
 color:var(--sp-top-menu-color,#fff);
 font-size:var(--sp-top-menu-size,13px);
 font-weight:var(--sp-top-menu-weight,700);
 font-style:var(--sp-top-menu-style,normal);
 text-decoration:var(--sp-top-menu-decoration,none);
 border-bottom:1px solid rgba(255,255,255,.08);
}
.sp-top-inner{
 max-width:1280px;
 margin:auto;
 padding:8px 20px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:18px;
}
.sp-top-left,.sp-top-right{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sp-top-menu a{color:inherit}
.sp-top-menu ul{display:flex;list-style:none;gap:14px;margin:0;padding:0;flex-wrap:wrap}
.sp-top-date{opacity:.85}
.sp-search-form{display:flex;align-items:center;gap:6px}
.sp-search-form input{border:0;border-radius:999px;padding:7px 10px;min-width:160px}
.sp-search-form button,.sp-random-btn{border:0;background:var(--accent);color:#fff;border-radius:999px;padding:8px 10px;font-weight:900;cursor:pointer}
.sp-social-icons{display:flex;gap:8px}
.sp-social-icons a{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);font-size:12px;font-weight:900}
.site-header.sp-sticky-nav{position:sticky;top:0}
.site-header:not(.sp-sticky-nav){position:relative}
.sp-sticky-logo{display:none;align-items:center;margin-right:10px}
.sp-sticky-logo img{max-height:34px;width:auto}
.site-header.sp-sticky-nav .sp-sticky-logo{display:flex}
.nav-wrap{display:flex;align-items:center;gap:14px}
.sp-random-btn{margin-left:auto;text-decoration:none}
.sp-main-nav-hidden .nav{display:none}
.sp-main-nav-hidden .sp-random-btn{display:none}
.sp-breaking-inner{max-width:1280px;margin:auto;display:flex;align-items:center;gap:12px}
.sp-breaking-label{font-weight:900;background:rgba(0,0,0,.18);padding:4px 8px;border-radius:999px;white-space:nowrap}
.sp-breaking-content{overflow:hidden;flex:1}
.sp-breaking-items{display:flex;gap:24px;align-items:center}
.sp-breaking-item{white-space:nowrap;color:#fff;font-weight:800}
.breaking-bar.sp-effect-ticker .sp-breaking-items{animation:spTicker var(--sp-breaking-speed,18000ms) linear infinite}
.breaking-bar.sp-effect-slide .sp-breaking-items{animation:spSlide var(--sp-breaking-speed,8000ms) ease-in-out infinite}
.breaking-bar.sp-effect-fade .sp-breaking-item{display:none}
.breaking-bar.sp-effect-fade .sp-breaking-item:first-child{display:inline;animation:spFade var(--sp-breaking-speed,3000ms) ease-in-out infinite}
@keyframes spTicker{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}
@keyframes spSlide{0%,25%{transform:translateX(0)}40%,65%{transform:translateX(-35%)}80%,100%{transform:translateX(-70%)}}
@keyframes spFade{0%,100%{opacity:.25}50%{opacity:1}}
.sp-live-results{
 position:absolute;
 background:#fff;
 color:#111;
 width:320px;
 max-width:90vw;
 right:20px;
 top:100%;
 border-radius:14px;
 box-shadow:0 12px 40px rgba(0,0,0,.2);
 overflow:hidden;
 z-index:999999;
 display:none;
}
.sp-live-results a{display:block;padding:10px 12px;border-bottom:1px solid #eee;color:#111}
.sp-live-results.is-visible{display:block}
@media(max-width:800px){
 .sp-top-inner,.header-inner{align-items:flex-start;flex-direction:column}
 .sp-top-left,.sp-top-right,.nav-wrap{width:100%;justify-content:flex-start}
 .sp-search-form input{min-width:120px}
}


/* SpillPH v2.8.2 Sticky Logo Fix */
.site-header .sp-sticky-logo{display:none!important}
.site-header.sp-sticky-nav.sp-is-stuck .sp-sticky-logo{display:flex!important}
.site-header.sp-sticky-nav.sp-is-stuck .logo{display:none!important}
.site-header.sp-sticky-nav.sp-is-stuck{
 box-shadow:0 12px 30px rgba(0,0,0,.18);
}


/* ==================================================
   SpillPH v2.9.0 Hybrid Viral News Navigation
================================================== */

.site-header{
 transition:all .28s ease;
}

.site-header.sp-is-stuck{
 background:rgba(8,8,10,.96);
 backdrop-filter:blur(18px);
}

.site-header.sp-is-stuck .header-inner{
 padding-top:10px;
 padding-bottom:10px;
}

.nav-wrap{
 flex:1;
 justify-content:flex-end;
}

.nav{
 position:relative;
}

.nav ul{
 align-items:center;
}

.nav li{
 position:relative;
}

.nav > ul > li > a,
.nav .menu > li > a{
 position:relative;
 display:flex;
 align-items:center;
 gap:6px;
 min-height:42px;
 padding:10px 3px;
 letter-spacing:.045em;
 transition:color .22s ease, transform .22s ease;
}

.nav > ul > li > a:after,
.nav .menu > li > a:after{
 content:"";
 position:absolute;
 left:0;
 right:0;
 bottom:3px;
 height:3px;
 border-radius:99px;
 background:linear-gradient(90deg,var(--accent),#ff8a00);
 transform:scaleX(0);
 transform-origin:left;
 transition:transform .25s ease;
}

.nav > ul > li:hover > a,
.nav .menu > li:hover > a{
 color:#fff;
 transform:translateY(-1px);
}

.nav > ul > li:hover > a:after,
.nav .menu > li:hover > a:after,
.nav .current-menu-item > a:after,
.nav .current-menu-parent > a:after,
.nav .current-menu-ancestor > a:after{
 transform:scaleX(1);
}

.nav .current-menu-item > a,
.nav .current-menu-parent > a,
.nav .current-menu-ancestor > a{
 color:var(--accent);
}

.nav li.menu-item-has-children > a:before{
 content:"▾";
 order:2;
 font-size:10px;
 opacity:.75;
 transform:translateY(1px);
}

.nav .sub-menu,
.nav .children{
 position:absolute;
 top:100%;
 left:0;
 min-width:230px;
 background:rgba(13,13,16,.98);
 border:1px solid rgba(255,255,255,.09);
 border-radius:18px;
 padding:10px;
 display:flex;
 flex-direction:column;
 gap:4px;
 opacity:0;
 visibility:hidden;
 transform:translateY(12px) scale(.98);
 transition:opacity .22s ease, transform .22s ease, visibility .22s ease;
 box-shadow:0 20px 60px rgba(0,0,0,.35);
 z-index:99999;
}

.nav li:hover > .sub-menu,
.nav li:hover > .children,
.nav li:focus-within > .sub-menu,
.nav li:focus-within > .children{
 opacity:1;
 visibility:visible;
 transform:translateY(0) scale(1);
}

.nav .sub-menu li,
.nav .children li{
 width:100%;
}

.nav .sub-menu a,
.nav .children a{
 display:flex;
 padding:11px 12px;
 border-radius:12px;
 color:#fff;
 font-size:13px;
 font-weight:800;
 text-transform:none;
 letter-spacing:0;
 transition:background .2s ease, color .2s ease, transform .2s ease;
}

.nav .sub-menu a:hover,
.nav .children a:hover{
 background:rgba(255,43,43,.16);
 color:#fff;
 transform:translateX(4px);
}

.nav .sub-menu .sub-menu,
.nav .children .children{
 top:0;
 left:100%;
 margin-left:10px;
}

.nav li.menu-item-has-children:hover > a{
 color:#fff;
}

/* Viral badge option: add CSS class "hot" or "trending" to menu item in WordPress Menu CSS Classes */
.nav li.hot > a:before,
.nav li.trending > a:before{
 content:"HOT";
 order:0;
 background:var(--accent);
 color:#fff;
 border-radius:999px;
 padding:2px 6px;
 font-size:9px;
 line-height:1;
 font-weight:900;
 letter-spacing:.06em;
}

.nav li.trending > a:before{
 content:"TREND";
 background:#ff8a00;
}

/* Right action buttons */
.sp-random-btn,
.sp-mobile-toggle{
 width:42px;
 height:42px;
 border-radius:999px;
 display:grid;
 place-items:center;
 background:rgba(255,255,255,.1);
 color:#fff;
 border:1px solid rgba(255,255,255,.12);
 transition:background .22s ease, transform .22s ease, border-color .22s ease;
}

.sp-random-btn:hover,
.sp-mobile-toggle:hover{
 background:var(--accent);
 transform:translateY(-2px) rotate(3deg);
 border-color:var(--accent);
}

.sp-mobile-toggle{
 display:none;
 cursor:pointer;
 font-size:20px;
}

/* Mobile offcanvas */
.sp-mobile-panel{
 position:fixed;
 inset:0 0 0 auto;
 width:min(360px,88vw);
 background:#0b0b0c;
 color:#fff;
 z-index:100000;
 transform:translateX(105%);
 transition:transform .28s ease;
 box-shadow:-20px 0 60px rgba(0,0,0,.45);
 padding:22px;
 overflow:auto;
}

.sp-mobile-panel.is-open{
 transform:translateX(0);
}

.sp-mobile-overlay{
 position:fixed;
 inset:0;
 background:rgba(0,0,0,.55);
 z-index:99999;
 opacity:0;
 visibility:hidden;
 transition:opacity .25s ease, visibility .25s ease;
}

.sp-mobile-overlay.is-open{
 opacity:1;
 visibility:visible;
}

.sp-mobile-head{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:12px;
 margin-bottom:20px;
}

.sp-mobile-brand{
 font-size:30px;
 font-weight:900;
 letter-spacing:-2px;
}

.sp-mobile-brand span{
 color:var(--accent);
}

.sp-mobile-close{
 border:0;
 background:rgba(255,255,255,.12);
 color:#fff;
 width:38px;
 height:38px;
 border-radius:999px;
 cursor:pointer;
 font-size:20px;
}

.sp-mobile-panel ul{
 list-style:none;
 padding:0;
 margin:0;
 display:flex;
 flex-direction:column;
 gap:6px;
}

.sp-mobile-panel a{
 display:flex;
 justify-content:space-between;
 align-items:center;
 color:#fff;
 padding:13px 12px;
 border-radius:14px;
 background:rgba(255,255,255,.04);
 font-weight:800;
 text-decoration:none;
}

.sp-mobile-panel .sub-menu,
.sp-mobile-panel .children{
 margin:6px 0 8px 14px;
 display:none;
}

.sp-mobile-panel li.is-expanded > .sub-menu,
.sp-mobile-panel li.is-expanded > .children{
 display:flex;
}

.sp-mobile-panel li.menu-item-has-children > a:after{
 content:"+";
 font-weight:900;
 color:var(--accent);
}

.sp-mobile-panel li.is-expanded > a:after{
 content:"−";
}

body.sp-mobile-lock{
 overflow:hidden;
}

body.spillph-layout-professional_news .nav > ul > li > a,
body.spillph-layout-professional_news .nav .menu > li > a,
body.spillph-layout-magazine .nav > ul > li > a,
body.spillph-layout-magazine .nav .menu > li > a,
body.spillph-layout-compact_newspaper .nav > ul > li > a,
body.spillph-layout-compact_newspaper .nav .menu > li > a{
 color:#111;
}

body.spillph-layout-professional_news .site-header.sp-is-stuck,
body.spillph-layout-magazine .site-header.sp-is-stuck,
body.spillph-layout-compact_newspaper .site-header.sp-is-stuck{
 background:rgba(255,255,255,.96);
}

@media(max-width:980px){
 .sp-mobile-toggle{
   display:grid;
 }
 .site-header .nav{
   display:none!important;
 }
 .nav-wrap{
   width:auto;
   margin-left:auto;
 }
 .sp-header-tagline{
   display:none;
 }
 .header-inner{
   flex-direction:row!important;
   align-items:center!important;
 }
}


/* ==================================================
   SpillPH v3.0.0 Featured Image Enhancements
================================================== */

.news-thumb{
 position:relative;
 overflow:hidden;
}

.news-thumb img{
 transition:transform .35s ease;
}

.news-card:hover .news-thumb img{
 transform:scale(1.045);
}

.news-thumb.is-placeholder{
 background:linear-gradient(135deg,#111,var(--accent));
 min-height:180px;
}

.news-thumb.is-placeholder:after{
 content:"SPILLPH";
 color:#fff;
 font-size:24px;
 font-weight:900;
 letter-spacing:-1px;
}

.single-featured-image{
 margin:26px -40px 30px;
 overflow:hidden;
 background:#111;
}

.single-featured-image img{
 width:100%;
 max-height:560px;
 object-fit:cover;
}

.featured-caption{
 font-size:13px;
 color:#777;
 margin:8px 40px 0;
}

.sp-featured-notice{
 background:#fff8e1;
 border-left:4px solid #ffb300;
 padding:14px 16px;
 margin:16px 0;
 border-radius:10px;
 font-weight:700;
}

@media(max-width:700px){
 .single-featured-image{
   margin-left:-24px;
   margin-right:-24px;
 }
 .featured-caption{
   margin-left:24px;
   margin-right:24px;
 }
}


/* ==================================================
   SpillPH v3.1.0 Post Settings + Social Networking
================================================== */

.sp-reading-progress{
 position:fixed;
 top:0;
 left:0;
 height:4px;
 width:0;
 background:linear-gradient(90deg,var(--accent),#ff8a00);
 z-index:999999;
 box-shadow:0 0 16px rgba(255,43,43,.5);
}

.sp-post-meta-line{
 display:flex;
 flex-wrap:wrap;
 align-items:center;
 gap:10px;
 color:var(--sp-post-meta-color,var(--accent));
 font-family:var(--sp-post-meta-font,var(--body-font));
 font-size:var(--sp-post-meta-size,12px);
 font-weight:var(--sp-post-meta-weight,800);
 text-transform:uppercase;
 letter-spacing:.04em;
 margin:0 0 14px;
}

.sp-post-meta-line a{
 color:inherit;
}

.sp-post-meta-line span{
 display:inline-flex;
 align-items:center;
 gap:5px;
}

.sp-author-box{
 margin-top:34px;
 padding:24px;
 border-radius:24px;
 background:#f8fafc;
 border:1px solid #e5e7eb;
 display:flex;
 gap:18px;
 align-items:flex-start;
}

.sp-author-avatar img{
 border-radius:50%;
}

.sp-author-info h3{
 margin:0 0 8px;
 font-size:22px;
}

.sp-author-info p{
 margin:0;
 color:#555;
 line-height:1.6;
}

.sp-next-prev{
 margin-top:28px;
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:16px;
}

.sp-next-prev a{
 background:#f8fafc;
 border:1px solid #e5e7eb;
 border-radius:20px;
 padding:18px;
 display:block;
 font-weight:900;
 color:#111;
 transition:transform .2s ease, border-color .2s ease;
}

.sp-next-prev a:hover{
 transform:translateY(-3px);
 border-color:var(--accent);
}

.sp-next-prev small{
 display:block;
 color:var(--accent);
 text-transform:uppercase;
 letter-spacing:.08em;
 font-size:11px;
 margin-bottom:6px;
}

.sp-social-icons-dynamic{
 display:flex;
 align-items:center;
 gap:10px;
 flex-wrap:wrap;
}

.sp-social-icons-dynamic a{
 width:34px;
 height:34px;
 border-radius:999px;
 display:grid;
 place-items:center;
 background:rgba(255,255,255,.12);
 color:#fff;
 font-size:13px;
 font-weight:900;
 text-decoration:none;
 border:1px solid rgba(255,255,255,.1);
 transition:transform .2s ease, background .2s ease;
}

.sp-social-icons-dynamic a:hover{
 transform:translateY(-2px);
 background:var(--accent);
}

.sp-footer-social{
 margin-top:18px;
}

.sp-footer-social .sp-social-icons-dynamic a{
 background:rgba(255,255,255,.1);
}

body.spillph-dark .sp-author-box,
body.spillph-dark .sp-next-prev a{
 background:#1f1f23;
 border-color:#333;
 color:#f4f4f5;
}

@media(max-width:700px){
 .sp-author-box{
   flex-direction:column;
 }
 .sp-next-prev{
   grid-template-columns:1fr;
 }
}


/* ==================================================
   SpillPH v3.2.0 External Comments / Facebook Comments
================================================== */

.sp-comments-section{
 margin-top:34px;
 padding:26px;
 border-radius:26px;
 background:#f8fafc;
 border:1px solid #e5e7eb;
}

.sp-comments-head{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:18px;
 margin-bottom:18px;
}

.sp-comments-head h2{
 margin:0;
 font-size:26px;
 letter-spacing:-1px;
}

.sp-comments-provider{
 display:inline-flex;
 align-items:center;
 gap:6px;
 background:#1877f2;
 color:#fff;
 border-radius:999px;
 padding:7px 10px;
 font-size:12px;
 font-weight:900;
}

.sp-comments-note{
 color:#64748b;
 font-size:13px;
 margin:10px 0 0;
}

.sp-comments-disabled{
 margin-top:28px;
 padding:18px;
 border-radius:18px;
 background:#f1f5f9;
 color:#64748b;
 font-weight:700;
}

body.spillph-dark .sp-comments-section,
body.spillph-dark .sp-comments-disabled{
 background:#1f1f23;
 border-color:#333;
 color:#f4f4f5;
}

body.spillph-dark .sp-comments-note{
 color:#aaa;
}


/* SpillPH v3.2.1 Facebook Comments Fix */
.sp-fb-admin-warning{
 margin:14px 0;
 padding:14px 16px;
 border-radius:14px;
 background:#fff7ed;
 border:1px solid #fed7aa;
 border-left:4px solid #f97316;
 color:#7c2d12;
 font-size:13px;
 line-height:1.5;
 font-weight:700;
}

.sp-fb-loader-note{
 color:#64748b;
 font-size:13px;
 margin:10px 0;
}


/* ==================================================
   SpillPH v3.2.2 Single Post Layout + FB Status Fix
================================================== */

.single-wrap.sp-single-modern{
 padding-top:0;
 overflow:hidden;
}

.sp-single-modern .single-featured-image{
 margin:0 -40px 30px;
 border-radius:0;
}

.sp-single-modern .single-featured-image img{
 width:100%;
 max-height:620px;
 object-fit:cover;
}

.sp-single-modern .sp-single-title{
 margin:0 0 12px;
}

.sp-single-modern .sp-post-meta-line{
 margin:0 0 24px;
 padding-bottom:18px;
 border-bottom:1px solid #e5e7eb;
}

.sp-fb-status{
 margin:14px 0;
 padding:14px 16px;
 border-radius:14px;
 background:#f8fafc;
 border:1px solid #e5e7eb;
 color:#475569;
 font-size:13px;
 line-height:1.5;
 font-weight:700;
}

.sp-fb-status.is-error{
 background:#fff7ed;
 border-color:#fed7aa;
 border-left:4px solid #f97316;
 color:#7c2d12;
}

.sp-fb-status a{
 color:#1877f2;
 font-weight:900;
}

@media(max-width:700px){
 .sp-single-modern .single-featured-image{
   margin-left:-24px;
   margin-right:-24px;
 }
}


/* ==================================================
   SpillPH v3.4.0 Sidebar System
================================================== */

.sp-layout-with-sidebar{
 display:grid;
 grid-template-columns:minmax(0,1fr) 330px;
 gap:28px;
 align-items:start;
}

.sp-layout-with-sidebar.sp-sidebar-left{
 grid-template-columns:330px minmax(0,1fr);
}

.sp-layout-with-sidebar.sp-sidebar-left .sp-sidebar-area{
 order:-1;
}

.sp-sidebar-area{
 background:#fff;
 border:1px solid #e5e7eb;
 border-radius:24px;
 padding:20px;
 box-shadow:var(--shadow);
}

.sp-sidebar-area.sp-sticky-active{
 position:sticky;
 top:110px;
}

.sp-sidebar-area .widget{
 margin-bottom:22px;
}

.sp-sidebar-area .widget:last-child{
 margin-bottom:0;
}

.sp-sidebar-area .widget-title,
.sp-sidebar-area h2,
.sp-sidebar-area h3{
 margin-top:0;
 font-size:20px;
 letter-spacing:-.5px;
}

.sp-sidebar-placeholder{
 color:#64748b;
 font-size:14px;
 line-height:1.6;
 background:#f8fafc;
 border:1px dashed #cbd5e1;
 border-radius:18px;
 padding:18px;
}

body.spillph-dark .sp-sidebar-area{
 background:#1c1c1f;
 border-color:#333;
 color:#f4f4f5;
}

body.spillph-dark .sp-sidebar-placeholder{
 background:#111;
 border-color:#333;
 color:#aaa;
}

@media(max-width:1000px){
 .sp-layout-with-sidebar,
 .sp-layout-with-sidebar.sp-sidebar-left{
   grid-template-columns:1fr;
 }
 .sp-layout-with-sidebar.sp-sidebar-left .sp-sidebar-area{
   order:0;
 }
 .sp-sidebar-area.sp-sticky-active{
   position:relative;
   top:auto;
 }
}


/* ==================================================
   SpillPH v3.6.0 Premium Footer System
================================================== */

.sp-footer-widgets{
 max-width:1280px;
 margin:0 auto 32px;
 display:grid;
 gap:22px;
}

.sp-footer-widgets.layout-1{grid-template-columns:1fr}
.sp-footer-widgets.layout-2{grid-template-columns:repeat(2,1fr)}
.sp-footer-widgets.layout-3{grid-template-columns:repeat(3,1fr)}
.sp-footer-widgets.layout-4{grid-template-columns:repeat(4,1fr)}
.sp-footer-widgets.layout-1-2{grid-template-columns:1fr 2fr}
.sp-footer-widgets.layout-2-1{grid-template-columns:2fr 1fr}
.sp-footer-widgets.layout-1-1-2{grid-template-columns:1fr 1fr 2fr}
.sp-footer-widgets.layout-2-1-1{grid-template-columns:2fr 1fr 1fr}

.sp-footer-widget-col{
 background:rgba(255,255,255,.05);
 border:1px solid rgba(255,255,255,.08);
 border-radius:20px;
 padding:18px;
 min-height:90px;
}

.sp-footer-widget-col .widget{
 margin-bottom:18px;
}

.sp-footer-widget-col .widget:last-child{
 margin-bottom:0;
}

.sp-footer-texts{
 margin-top:22px;
 color:rgba(255,255,255,.78);
 font-size:13px;
 line-height:1.6;
}

.sp-footer-texts p{
 margin:6px 0;
}

.sp-go-top{
 position:fixed;
 right:22px;
 bottom:22px;
 width:46px;
 height:46px;
 border-radius:999px;
 border:0;
 background:var(--accent);
 color:#fff;
 font-size:20px;
 font-weight:900;
 cursor:pointer;
 z-index:99999;
 box-shadow:0 12px 34px rgba(0,0,0,.25);
 opacity:0;
 visibility:hidden;
 transform:translateY(12px);
 transition:.25s ease;
}

.sp-go-top.is-visible{
 opacity:1;
 visibility:visible;
 transform:translateY(0);
}

.sp-go-top:hover{
 transform:translateY(-3px);
}

@media(max-width:900px){
 .sp-footer-widgets,
 .sp-footer-widgets.layout-1,
 .sp-footer-widgets.layout-2,
 .sp-footer-widgets.layout-3,
 .sp-footer-widgets.layout-4,
 .sp-footer-widgets.layout-1-2,
 .sp-footer-widgets.layout-2-1,
 .sp-footer-widgets.layout-1-1-2,
 .sp-footer-widgets.layout-2-1-1{
   grid-template-columns:1fr;
 }
}


/* SpillPH v3.6.2 Sidebar ON/OFF Controls */
.sp-layout-fullwidth{
 display:block;
}

.sp-layout-fullwidth .sp-main-content{
 width:100%;
}

.sp-layout-fullwidth .single-wrap{
 max-width:1100px;
}

.sp-layout-fullwidth .news-grid{
 grid-template-columns:repeat(3,1fr);
}

@media(max-width:900px){
 .sp-layout-fullwidth .news-grid{
   grid-template-columns:1fr;
 }
}


/* ==================================================
   SpillPH v3.8.0 Font Awesome Icon System
================================================== */

.sp-icon,
.sp-social-icons-dynamic i,
.sp-comments-provider i,
.sp-random-btn i,
.sp-mobile-toggle i,
.sp-mobile-close i,
.sp-go-top i,
.sp-post-meta-line i,
.sp-breaking-label i{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 line-height:1;
}

.sp-post-meta-line i{
 color:var(--accent);
 margin-right:4px;
}

.sp-comments-provider{
 gap:7px;
}

.sp-random-btn,
.sp-mobile-toggle,
.sp-go-top{
 font-family:inherit;
}

.sp-social-icons-dynamic a i{
 font-size:14px;
}

.sp-top-menu .sp-social-icons-dynamic a,
.sp-footer-social .sp-social-icons-dynamic a{
 text-transform:none;
}


/* ==================================================
   SpillPH v3.9.0 Styling Engine
================================================== */

body{
 background-color:var(--sp-body-bg-color, var(--bg));
 background-image:var(--sp-body-bg-image, none);
 background-repeat:var(--sp-body-bg-repeat, no-repeat);
 background-size:var(--sp-body-bg-size, cover);
 background-position:var(--sp-body-bg-position, center center);
 background-attachment:var(--sp-body-bg-attachment, scroll);
 color:var(--sp-body-text-color, inherit);
}

body.sp-fullscreen-bg{
 background-size:cover;
 background-attachment:fixed;
}

a{
 color:var(--sp-links-color, inherit);
 text-decoration:var(--sp-links-decoration, none);
}

a:hover{
 color:var(--sp-links-hover-color, var(--accent));
 text-decoration:var(--sp-links-hover-decoration, none);
}

::selection{
 background:var(--sp-highlight-color, var(--accent));
 color:#fff;
}

.sp-top-menu{
 background-color:var(--sp-top-nav-bg-color, #070707);
 background-image:var(--sp-top-nav-bg-image, none);
 background-repeat:var(--sp-top-nav-bg-repeat, no-repeat);
 background-size:var(--sp-top-nav-bg-size, cover);
 background-position:var(--sp-top-nav-bg-position, center center);
 color:var(--sp-top-nav-links-color, #fff);
}

.sp-top-menu a{
 color:var(--sp-top-nav-links-color, #fff);
}

.sp-top-menu a:hover{
 color:var(--sp-top-nav-links-hover-color, var(--accent));
}

.sp-top-date{
 color:var(--sp-top-nav-date-color, rgba(255,255,255,.85));
}

.site-header{
 background-color:var(--sp-header-bg-color, var(--header-bg));
 background-image:var(--sp-header-bg-image, none);
 background-repeat:var(--sp-header-bg-repeat, no-repeat);
 background-size:var(--sp-header-bg-size, cover);
 background-position:var(--sp-header-bg-position, center center);
}

.nav,
.nav-wrap{
 background:var(--sp-main-nav-bg-color, transparent);
}

.header-inner{
 border-bottom-color:var(--sp-main-nav-border-color, rgba(255,255,255,.08));
}

.nav .sub-menu,
.nav .children{
 background:var(--sp-sub-menu-bg-color, rgba(13,13,16,.98));
}

.nav a{
 color:var(--sp-main-nav-links-color, inherit);
}

.nav a:hover{
 color:var(--sp-main-nav-links-hover-color, #fff);
}

.nav .current-menu-item > a,
.nav .current-menu-parent > a,
.nav .current-menu-ancestor > a{
 color:var(--sp-main-nav-current-color, var(--accent));
}

.nav > ul > li:not(:last-child),
.nav .menu > li:not(:last-child){
 border-right:1px solid var(--sp-main-nav-separator-one, transparent);
}

.breaking-bar{
 background:var(--sp-breaking-bg-color, var(--accent));
}

.main,
.sp-main-content{
 background-color:var(--sp-main-content-bg-color, transparent);
 background-image:var(--sp-main-content-bg-image, none);
 background-repeat:var(--sp-main-content-bg-repeat, no-repeat);
 background-size:var(--sp-main-content-bg-size, cover);
 background-position:var(--sp-main-content-bg-position, center center);
}

.news-card,
.side-card,
.trending-box,
.single-wrap,
.sp-sidebar-area{
 background-color:var(--sp-blocks-bg-color, #fff);
 background-image:var(--sp-blocks-bg-image, none);
 background-repeat:var(--sp-blocks-bg-repeat, no-repeat);
 background-size:var(--sp-blocks-bg-size, cover);
 background-position:var(--sp-blocks-bg-position, center center);
}

.article-content a,
.single-wrap a{
 color:var(--sp-post-links-color, var(--accent));
 text-decoration:var(--sp-post-links-decoration, underline);
}

.article-content a:hover,
.single-wrap a:hover{
 color:var(--sp-post-links-hover-color, #b91c1c);
 text-decoration:var(--sp-post-links-hover-decoration, underline);
}

.site-footer{
 background-color:var(--sp-footer-bg-color, var(--footer-bg));
 background-image:var(--sp-footer-bg-image, none);
 background-repeat:var(--sp-footer-bg-repeat, no-repeat);
 background-size:var(--sp-footer-bg-size, cover);
 background-position:var(--sp-footer-bg-position, center center);
}

.site-footer .widget-title,
.site-footer h3{
 color:var(--sp-footer-widget-title-color, #fff);
}

.site-footer a{
 color:var(--sp-footer-links-color, rgba(255,255,255,.88));
}

.site-footer a:hover{
 color:var(--sp-footer-links-hover-color, var(--accent));
}


/* SpillPH v3.9.3 Smart Comment Meta */
.sp-disqus-comment-count{
 display:inline-flex;
 align-items:center;
 gap:5px;
}

.sp-comment-provider-fallback{
 display:inline-flex;
 align-items:center;
 gap:5px;
 opacity:.9;
}


/* SpillPH v3.9.4 Disqus Count Fix */
.sp-disqus-comment-count a{
 color:inherit;
 text-decoration:none;
}
.sp-disqus-comment-count a:hover{
 color:var(--accent);
}


/* SpillPH v3.9.5 Forced Disqus Count Refresh */
.sp-disqus-count-pending{
 opacity:.75;
}


/* SpillPH v3.9.7 Trending Widget Area */
.sp-trending-widget-area{
 background:var(--sp-blocks-bg-color,#fff);
 border:1px solid #e5e7eb;
 border-radius:24px;
 padding:20px;
 box-shadow:var(--shadow);
}

.sp-trending-widget-area .widget{
 margin-bottom:20px;
}

.sp-trending-widget-area .widget:last-child{
 margin-bottom:0;
}

body.spillph-dark .sp-trending-widget-area{
 background:#1c1c1f;
 border-color:#333;
}


/* ==================================================
   SpillPH v3.9.9 Minimalist Social Icons
================================================== */

.sp-social-icons-dynamic{
 display:flex;
 align-items:center;
 gap:14px;
 flex-wrap:wrap;
}

.sp-social-icons-dynamic a{
 width:auto;
 height:auto;
 border:none;
 border-radius:0;
 background:transparent;
 color:inherit;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 text-decoration:none;
 box-shadow:none;
 padding:0;
 transition:
   opacity .18s ease,
   transform .18s ease,
   color .18s ease;
}

.sp-social-icons-dynamic a i{
 font-size:15px;
 line-height:1;
 font-weight:400;
}

.sp-social-icons-dynamic a:hover{
 color:var(--accent);
 opacity:.88;
 transform:translateY(-1px);
 background:transparent;
 box-shadow:none;
}

.sp-top-menu .sp-social-icons-dynamic{
 gap:12px;
}

.sp-top-menu .sp-social-icons-dynamic a i{
 font-size:13px;
 opacity:.88;
}

.site-footer .sp-social-icons-dynamic{
 gap:16px;
}

.site-footer .sp-social-icons-dynamic a{
 opacity:.9;
}

.site-footer .sp-social-icons-dynamic a:hover{
 opacity:1;
}

@media(max-width:768px){
 .sp-social-icons-dynamic{
   gap:12px;
 }
}


/* ==================================================
   SpillPH v4.0.0 Minimal Article Share Modal
================================================== */

.sp-article-share-wrap{
 margin:14px 0 24px;
 display:flex;
 align-items:center;
 gap:10px;
}

.sp-share-trigger{
 border:1px solid #e5e7eb;
 background:#fff;
 color:#111827;
 border-radius:999px;
 padding:10px 16px;
 font-weight:900;
 display:inline-flex;
 align-items:center;
 gap:8px;
 cursor:pointer;
 transition:transform .18s ease, border-color .18s ease, color .18s ease;
}

.sp-share-trigger:hover{
 transform:translateY(-1px);
 border-color:var(--accent);
 color:var(--accent);
}

.sp-share-overlay{
 position:fixed;
 inset:0;
 background:rgba(0,0,0,.55);
 backdrop-filter:blur(6px);
 z-index:1000000;
 display:none;
 align-items:center;
 justify-content:center;
 padding:20px;
}

.sp-share-overlay.is-open{
 display:flex;
}

.sp-share-modal{
 width:min(460px,94vw);
 background:#fff;
 border-radius:28px;
 box-shadow:0 30px 90px rgba(0,0,0,.35);
 padding:26px;
 position:relative;
 animation:spShareIn .22s ease both;
}

@keyframes spShareIn{
 from{opacity:0;transform:translateY(12px) scale(.98)}
 to{opacity:1;transform:translateY(0) scale(1)}
}

.sp-share-head{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:14px;
 margin-bottom:18px;
}

.sp-share-head h3{
 margin:0;
 font-size:24px;
 letter-spacing:-.8px;
}

.sp-share-close{
 border:0;
 background:#f3f4f6;
 color:#111827;
 width:38px;
 height:38px;
 border-radius:999px;
 cursor:pointer;
 display:grid;
 place-items:center;
}

.sp-share-url{
 background:#f8fafc;
 border:1px solid #e5e7eb;
 border-radius:16px;
 padding:12px 14px;
 font-size:13px;
 color:#64748b;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
 margin-bottom:16px;
}

.sp-share-grid{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:10px;
}

.sp-share-option{
 border:1px solid #e5e7eb;
 background:#fff;
 color:#111827;
 border-radius:16px;
 min-height:72px;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 gap:8px;
 text-decoration:none;
 font-weight:900;
 font-size:12px;
 cursor:pointer;
 transition:transform .18s ease, border-color .18s ease, color .18s ease, background .18s ease;
}

.sp-share-option i{
 font-size:19px;
}

.sp-share-option:hover{
 transform:translateY(-2px);
 border-color:var(--accent);
 color:var(--accent);
 background:#fff;
}

.sp-share-toast{
 margin-top:14px;
 background:#ecfdf5;
 color:#166534;
 border:1px solid #bbf7d0;
 border-radius:14px;
 padding:10px 12px;
 font-size:13px;
 font-weight:900;
 display:none;
 text-align:center;
}

.sp-share-toast.is-visible{
 display:block;
}

body.spillph-dark .sp-share-modal,
body.spillph-dark .sp-share-trigger,
body.spillph-dark .sp-share-option{
 background:#1f1f23;
 color:#f4f4f5;
 border-color:#333;
}

body.spillph-dark .sp-share-close,
body.spillph-dark .sp-share-url{
 background:#111;
 color:#d1d5db;
 border-color:#333;
}

@media(max-width:520px){
 .sp-share-grid{
   grid-template-columns:repeat(3,1fr);
 }
 .sp-share-modal{
   border-radius:24px;
   padding:22px;
 }
}


/* SpillPH v4.0.1 Inline Share Buttons */
.sp-article-share-wrap{
 display:flex;
 align-items:center;
 flex-wrap:wrap;
 gap:10px;
 margin:14px 0 26px;
}

.sp-share-inline-label{
 font-size:13px;
 font-weight:800;
 opacity:.75;
 margin-right:2px;
}

.sp-share-inline-buttons{
 display:flex;
 align-items:center;
 flex-wrap:wrap;
 gap:8px;
}

.sp-share-inline-btn{
 display:inline-flex;
 align-items:center;
 gap:8px;
 padding:8px 12px;
 border:1px solid #ececec;
 border-radius:14px;
 background:var(--sp-share-platform-color, transparent);
 text-decoration:none;
 color:#ffffff;
 font-size:13px;
 font-weight:700;
 transition:all .18s ease;
 cursor:pointer;
}

.sp-share-inline-btn i{
 font-size:14px;
}

.sp-share-inline-btn:hover{
 border-color:var(--sp-share-platform-color, var(--accent));
 color:var(--sp-share-font-color, #ffffff);
 filter:brightness(.92);
 transform:translateY(-1px);
}

.sp-share-copy-toast{
 font-size:12px;
 font-weight:700;
 color:#16a34a;
 display:none;
}

.sp-share-copy-toast.is-visible{
 display:inline-block;
}

.sp-share-overlay{
 display:none !important;
}


/* ==================================================
   SpillPH v4.0.8 Standardized Share Button Typography + Dual Placement
================================================== */

.sp-article-share-wrap.sp-share-bottom{
 margin-top:28px;
 padding-top:18px;
 border-top:1px solid #e5e7eb;
}

.sp-share-inline-btn,
.sp-share-inline-label{
 font-family:var(--sp-share-font-family, Inter, Arial, sans-serif);
}

.sp-share-inline-label{
 font-size:var(--sp-share-font-size, 12px);
 font-weight:var(--sp-share-font-weight, 700);
 font-style:var(--sp-share-font-style, normal);
 text-decoration:var(--sp-share-font-decoration, none);
}

.sp-share-inline-btn{
 font-size:var(--sp-share-font-size, 12px);
 font-weight:var(--sp-share-font-weight, 700);
 font-style:var(--sp-share-font-style, normal);
 text-decoration:var(--sp-share-font-decoration, none);
 color:var(--sp-share-font-color, #ffffff);
}

.sp-share-inline-btn i{
 font-size:var(--sp-share-font-size, 12px);
 color:var(--sp-share-font-color, #ffffff);
}

.sp-share-inline-label i{
 font-size:var(--sp-share-font-size, 12px);
}

body.spillph-dark .sp-article-share-wrap.sp-share-bottom{
 border-top-color:#333;
}

/* SpillPH v4.0.7 Official Platform Share Button Colors */
.sp-share-facebook{--sp-share-platform-color:#1877F2;border-color:#1877F2;}
.sp-share-x{--sp-share-platform-color:#000000;border-color:#000000;}
.sp-share-messenger{--sp-share-platform-color:#0084FF;border-color:#0084FF;}
.sp-share-whatsapp{--sp-share-platform-color:#25D366;border-color:#25D366;}
.sp-share-telegram{--sp-share-platform-color:#26A5E4;border-color:#26A5E4;}
.sp-share-reddit{--sp-share-platform-color:#FF4500;border-color:#FF4500;}
.sp-share-email{--sp-share-platform-color:#6B7280;border-color:#6B7280;}
.sp-share-copy{--sp-share-platform-color:#111827;border-color:#111827;}

.sp-share-inline-btn:focus{
 outline:2px solid rgba(0,0,0,.18);
 outline-offset:2px;
}

body.spillph-dark .sp-share-copy{
 --sp-share-platform-color:#374151;
 border-color:#374151;
}

/* SpillPH v4.1.2+: Keep Post Styling scoped to article links only.
   Share buttons must always follow Typography > Share Button settings. */
.single-wrap .sp-article-share-wrap a.sp-share-inline-btn,
.single-wrap .sp-article-share-wrap button.sp-share-inline-btn,
.article-content .sp-article-share-wrap a.sp-share-inline-btn,
.article-content .sp-article-share-wrap button.sp-share-inline-btn{
 color:var(--sp-share-font-color, #ffffff) !important;
 text-decoration:var(--sp-share-font-decoration, none) !important;
 font-family:var(--sp-share-font-family, Inter, Arial, sans-serif) !important;
 font-size:var(--sp-share-font-size, 12px) !important;
 font-weight:var(--sp-share-font-weight, 700) !important;
 font-style:var(--sp-share-font-style, normal) !important;
}

.single-wrap .sp-article-share-wrap a.sp-share-inline-btn:hover,
.single-wrap .sp-article-share-wrap button.sp-share-inline-btn:hover,
.article-content .sp-article-share-wrap a.sp-share-inline-btn:hover,
.article-content .sp-article-share-wrap button.sp-share-inline-btn:hover{
 color:var(--sp-share-font-color, #ffffff) !important;
 text-decoration:var(--sp-share-font-decoration, none) !important;
}


/* SpillPH v4.3.0 Hero Grid Settings */
.hero-grid.hero-grid-magazine{grid-template-columns:1.45fr 1fr}
.hero-grid.hero-grid-magazine .hero-side{grid-template-columns:repeat(2,minmax(0,1fr))}
.hero-grid.hero-grid-magazine .hero-main{min-height:600px}
.hero-grid.hero-grid-magazine .side-card .news-title{font-size:18px;letter-spacing:-.4px}
.hero-grid.hero-grid-stack{grid-template-columns:1fr}
.hero-grid.hero-grid-stack .hero-side{grid-template-columns:repeat(4,minmax(0,1fr))}
.hero-grid.hero-grid-stack .hero-main{min-height:520px}
.hero-grid.hero-grid-compact{grid-template-columns:1.6fr 1fr}
.hero-grid.hero-grid-compact .hero-main{min-height:460px;border-radius:24px}
.hero-grid.hero-grid-compact .hero-side{gap:12px}
.hero-grid.hero-grid-compact .side-card{display:grid;grid-template-columns:120px 1fr;border-radius:18px}
.hero-grid.hero-grid-compact .side-card .news-thumb{aspect-ratio:auto;min-height:110px}
.hero-grid.hero-grid-compact .side-card-content{padding:12px}
.hero-grid.hero-grid-compact .side-card .news-title{font-size:17px;letter-spacing:-.3px}
.hero-date{color:#e5e7eb;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-top:8px}
@media(max-width:1000px){.hero-grid.hero-grid-magazine,.hero-grid.hero-grid-compact{grid-template-columns:1fr}.hero-grid.hero-grid-stack .hero-side,.hero-grid.hero-grid-magazine .hero-side{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.hero-grid.hero-grid-stack .hero-side,.hero-grid.hero-grid-magazine .hero-side{grid-template-columns:1fr}.hero-grid.hero-grid-compact .side-card{grid-template-columns:1fr}.hero-grid.hero-grid-compact .side-card .news-thumb{aspect-ratio:16/10}}

/* v4.3.1 Hero Grid template sync */
.hero-main-link{position:absolute;inset:0;display:block;z-index:0}.hero-main-link img{width:100%;height:100%;object-fit:cover}.hero-overlay{z-index:1;pointer-events:none}.hero-content a,.hero-side a{pointer-events:auto}


/* SpillPH v4.4.0 Hero Grid Builder frontend layouts */
.hero-grid{margin-bottom:32px}
.hero-grid .hero-main,.hero-grid .side-card{isolation:isolate}
.hero-grid .side-card{position:relative;min-height:0}
.hero-grid .side-card .news-thumb{aspect-ratio:16/10;overflow:hidden}
.hero-grid .side-card .news-thumb img{width:100%;height:100%;object-fit:cover}
.hero-grid-classic{grid-template-columns:1.35fr 1fr!important;align-items:stretch}
.hero-grid-classic .hero-main{min-height:560px}
.hero-grid-classic .hero-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.hero-grid-classic .side-card{border-radius:22px;overflow:hidden}
.hero-grid-classic .side-card-content{padding:14px}
.hero-grid-classic .side-card .news-title{font-size:18px;line-height:1.08;letter-spacing:-.5px}
.hero-grid-magazine{grid-template-columns:1.35fr 1fr!important;align-items:stretch}
.hero-grid-magazine .hero-main{min-height:500px}
.hero-grid-magazine .hero-side{display:grid;grid-template-columns:1fr;gap:16px}
.hero-grid-magazine .side-card{display:grid;grid-template-columns:42% 1fr;min-height:0;border-radius:22px}
.hero-grid-magazine .side-card .news-thumb{aspect-ratio:auto;min-height:0;height:100%}
.hero-grid-magazine .side-card-content{padding:18px}
.hero-grid-stack{grid-template-columns:1.45fr .9fr!important;align-items:stretch}
.hero-grid-stack .hero-main{min-height:560px}
.hero-grid-stack .hero-side{display:grid;grid-template-columns:1fr;gap:12px}
.hero-grid-stack .side-card{display:grid;grid-template-columns:124px 1fr;border-radius:18px;box-shadow:0 8px 26px rgba(0,0,0,.06)}
.hero-grid-stack .side-card .news-thumb{aspect-ratio:auto;height:100%;min-height:108px}
.hero-grid-stack .side-card-content{padding:12px 14px}
.hero-grid-stack .side-card .news-title{font-size:17px;letter-spacing:-.4px;margin:6px 0}
.hero-grid-compact{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:16px}
.hero-grid-compact .hero-main{grid-column:span 1;min-height:300px;border-radius:22px}
.hero-grid-compact .hero-overlay{padding:18px}
.hero-grid-compact .hero-content h1{font-size:24px;line-height:1.02;letter-spacing:-1.2px}
.hero-grid-compact .hero-content p{display:none}
.hero-grid-compact .hero-side{display:contents}
.hero-grid-compact .side-card{border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
.hero-grid-compact .side-card-content{padding:14px}
.hero-grid-compact .side-card .news-title{font-size:18px;line-height:1.08;letter-spacing:-.5px}
.hero-grid-compact .side-card .news-thumb{aspect-ratio:16/12}
.hero-grid.hero-display-carousel{display:flex!important;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:4px;padding-bottom:10px;-webkit-overflow-scrolling:touch}
.hero-grid.hero-display-carousel::-webkit-scrollbar{height:8px}.hero-grid.hero-display-carousel::-webkit-scrollbar-thumb{background:rgba(255,43,43,.45);border-radius:999px}
.hero-grid.hero-display-carousel .hero-main,.hero-grid.hero-display-carousel .side-card{flex:0 0 min(82vw,520px);scroll-snap-align:start;min-height:430px;border-radius:24px}
.hero-grid.hero-display-carousel .hero-side{display:flex!important;gap:16px;contents:normal}
.hero-grid.hero-display-carousel .side-card{display:flex;flex-direction:column}.hero-grid.hero-display-carousel .side-card .news-thumb{aspect-ratio:16/10;height:auto}.hero-grid.hero-display-carousel .hero-content h1{font-size:clamp(30px,4vw,48px);letter-spacing:-2px;line-height:1}
@media(max-width:1100px){.hero-grid-classic,.hero-grid-magazine,.hero-grid-stack{grid-template-columns:1fr!important}.hero-grid-classic .hero-side{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-grid-compact{grid-template-columns:repeat(2,minmax(0,1fr))!important}.hero-grid-compact .hero-main{grid-column:span 2}}
@media(max-width:760px){.hero-grid-classic .hero-side{grid-template-columns:1fr}.hero-grid-magazine .side-card,.hero-grid-stack .side-card{grid-template-columns:1fr}.hero-grid-magazine .side-card .news-thumb,.hero-grid-stack .side-card .news-thumb{aspect-ratio:16/10;height:auto}.hero-grid-compact{grid-template-columns:1fr!important}.hero-grid-compact .hero-main{grid-column:span 1}.hero-main{min-height:420px}.hero-content h1{font-size:34px;letter-spacing:-1.5px}.hero-grid.hero-display-grid_mobile_carousel{display:flex!important;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;-webkit-overflow-scrolling:touch}.hero-grid.hero-display-grid_mobile_carousel .hero-main,.hero-grid.hero-display-grid_mobile_carousel .side-card{flex:0 0 86vw;scroll-snap-align:start;min-height:430px;border-radius:24px}.hero-grid.hero-display-grid_mobile_carousel .hero-side{display:flex!important;gap:14px;contents:normal}.hero-grid.hero-display-grid_mobile_carousel .side-card{display:flex;flex-direction:column}.hero-grid.hero-display-grid_mobile_carousel .side-card .news-thumb{aspect-ratio:16/10}.hero-grid.hero-display-grid_mobile_carousel::-webkit-scrollbar{height:6px}.hero-grid.hero-display-grid_mobile_carousel::-webkit-scrollbar-thumb{background:rgba(255,43,43,.45);border-radius:999px}}


/* v4.4.2 Global Design Controls: live radius sync + frontend radius */
.news-card,
.side-card,
.hero-grid,
.hero-main,
.hero-side,
.trending-box,
.widget,
.sp-sidebar-placeholder,
.sp-trending-widget-area,
.sp-comments-section,
.sp-comment-provider-fallback,
.sp-article-share-wrap,
.sp-share-modal,
.sp-search-form,
.sp-footer-widgets,
.sp-footer-widget-col,
.sp-breaking-inner,
.spillph-card-list .news-card,
.spillph-card-mixed .news-card,
article,
.entry-content,
.post-navigation,
.author-box,
.related-posts,
.wp-block-image img,
.wp-block-embed,
.wp-block-table,
input,
select,
textarea{
  border-radius:var(--sp-global-radius,14px) !important;
}
.hero-main img,
.hero-side img,
.news-card img,
.side-card img,
.trending-box img,
.widget img,
.sp-comments-section iframe,
.sp-share-inline-btn,
.sp-share-trigger,
button,
.button,
.wp-block-button__link{
  border-radius:calc(var(--sp-global-radius,14px) * .75) !important;
}
.sp-breaking-label,
.sp-share-copy-toast,
.sp-share-toast,
.sp-share-inline-label,
.category-badge,
.post-category,
.badge,
.tagcloud a{
  border-radius:999px !important;
}


/* ================================
   SpillPH v4.4.3 Homepage Section Heading Aesthetic
   Clean news-style titles with red accent bar + divider line.
================================ */
.section-header,
.sp-home-section-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:0 0 18px;
  padding:0 0 8px;
  border-bottom:1px solid rgba(15,23,42,.12);
}
.section-title,
.sp-home-section-title{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  margin:0;
  color:var(--sp-blocks-titles-color,#111);
  font-family:var(--sp-blocks-titles-font,var(--heading-font));
  font-size:var(--sp-blocks-titles-size,18px);
  font-weight:var(--sp-blocks-titles-weight,900);
  font-style:var(--sp-blocks-titles-style,normal);
  text-decoration:var(--sp-blocks-titles-decoration,none);
  line-height:1.1;
  letter-spacing:-.35px;
  text-transform:uppercase;
}
.section-title::before,
.sp-home-section-title::before{
  content:"";
  display:inline-block;
  width:4px;
  height:22px;
  border-radius:999px;
  background:var(--accent,#ff2b2b);
  flex:0 0 auto;
}
.section-header .view-all,
.section-header .sp-view-all,
.sp-home-section-header .view-all,
.sp-home-section-header .sp-view-all{
  font-size:12px;
  font-weight:800;
  color:#6b7280;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.trending-title,
.sp-sidebar-area h2,
.widget-title{
  position:relative;
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 0 16px;
  padding:0 0 8px;
  border-bottom:1px solid rgba(15,23,42,.12);
  color:var(--sp-blocks-titles-color,#111);
  font-family:var(--sp-blocks-titles-font,var(--heading-font));
  font-size:var(--sp-blocks-titles-size,18px);
  font-weight:var(--sp-blocks-titles-weight,900);
  font-style:var(--sp-blocks-titles-style,normal);
  text-decoration:var(--sp-blocks-titles-decoration,none);
  line-height:1.1;
  letter-spacing:-.35px;
  text-transform:uppercase;
}
.trending-title::before,
.sp-sidebar-area h2::before,
.widget-title::before{
  content:"";
  display:inline-block;
  width:4px;
  height:22px;
  border-radius:999px;
  background:var(--accent,#ff2b2b);
  flex:0 0 auto;
}
body.spillph-dark .section-header,
body.spillph-dark .sp-home-section-header,
body.spillph-dark .trending-title,
body.spillph-dark .sp-sidebar-area h2,
body.spillph-dark .widget-title{
  border-bottom-color:rgba(255,255,255,.14);
}
body.spillph-dark .section-title,
body.spillph-dark .sp-home-section-title,
body.spillph-dark .trending-title,
body.spillph-dark .sp-sidebar-area h2,
body.spillph-dark .widget-title{
  color:#f4f4f5;
}
@media(max-width:700px){
  .section-header,.sp-home-section-header{margin-bottom:14px;padding-bottom:7px}
  .section-title,.sp-home-section-title,.trending-title,.sp-sidebar-area h2,.widget-title{font-size:16px;letter-spacing:-.2px}
  .section-title::before,.sp-home-section-title::before,.trending-title::before,.sp-sidebar-area h2::before,.widget-title::before{height:20px;width:3px}
}

/* v4.4.4 Hero Grid Image-Only Overlay Cards */
.hero-grid .hero-main,
.hero-grid .side-card{
  position:relative;
  overflow:hidden;
  background:#0b0b0c;
  border:0;
  box-shadow:0 14px 38px rgba(15,23,42,.16);
}
.hero-grid .hero-main img,
.hero-grid .side-card .news-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.001);
  transition:transform .28s ease, filter .28s ease;
}
.hero-grid .hero-main:hover img,
.hero-grid .side-card:hover .news-thumb img{
  transform:scale(1.045);
  filter:saturate(1.08);
}
.hero-grid .hero-main::after,
.hero-grid .side-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.05) 20%,rgba(0,0,0,.48) 58%,rgba(0,0,0,.88) 100%);
}
.hero-grid .hero-main-link,
.hero-grid .side-card .news-thumb{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  aspect-ratio:auto!important;
  min-height:0!important;
  background:linear-gradient(135deg,#111827,#374151);
}
.hero-grid .hero-overlay,
.hero-grid .side-card-content{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:8px;
  padding:22px;
  background:transparent!important;
  color:#fff;
  pointer-events:none;
}
.hero-grid .hero-content,
.hero-grid .side-card-content > *{
  pointer-events:auto;
}
.hero-grid .hero-content p{
  display:none!important;
}
.hero-grid .hero-content h1,
.hero-grid .side-card .news-title{
  margin:6px 0 0;
  color:#fff!important;
  text-shadow:0 2px 12px rgba(0,0,0,.42);
}
.hero-grid .hero-content h1 a,
.hero-grid .side-card .news-title a{
  color:#fff!important;
}
.hero-grid .news-meta,
.hero-grid .hero-date{
  color:rgba(255,255,255,.82)!important;
  font-size:12px;
  font-weight:700;
  text-shadow:0 1px 8px rgba(0,0,0,.4);
}
.hero-grid .badge{
  align-self:flex-start;
  color:#fff!important;
  background:var(--accent,#ff2b2b)!important;
  box-shadow:0 5px 14px rgba(0,0,0,.22);
}
.hero-grid-classic .side-card,
.hero-grid-magazine .side-card,
.hero-grid-stack .side-card,
.hero-grid-compact .side-card{
  display:block!important;
  grid-template-columns:none!important;
  min-height:220px;
}
.hero-grid-classic .side-card{min-height:272px}
.hero-grid-magazine .side-card{min-height:242px}
.hero-grid-stack .side-card{min-height:132px}
.hero-grid-compact .side-card{min-height:300px}
.hero-grid-stack .side-card-content{padding:14px 16px}
.hero-grid-compact .side-card-content{padding:16px}
.hero-grid-compact .hero-main::after,
.hero-grid-compact .side-card::after{
  background:linear-gradient(180deg,rgba(0,0,0,.02) 16%,rgba(0,0,0,.52) 62%,rgba(0,0,0,.9) 100%);
}
.hero-grid-carousel .side-card,
.hero-display-carousel .side-card,
.hero-display-grid_mobile_carousel .side-card{
  display:block!important;
}
@media(max-width:1000px){
  .hero-grid-classic .side-card,
  .hero-grid-magazine .side-card,
  .hero-grid-stack .side-card,
  .hero-grid-compact .side-card{min-height:240px}
}
@media(max-width:640px){
  .hero-grid .hero-overlay,
  .hero-grid .side-card-content{padding:18px}
  .hero-grid .hero-content h1{font-size:34px;letter-spacing:-1.3px;line-height:1}
  .hero-grid .side-card .news-title{font-size:20px;line-height:1.05}
  .hero-grid .side-card{min-height:260px!important}
}


/* ==================================================
   SpillPH v4.4.5 Mobile Single Article Centering Fix
   Keeps single article content properly centered and prevents horizontal drift on phones.
================================================== */
@media (max-width: 700px){
  html,
  body{
    max-width:100%;
    overflow-x:hidden;
  }

  .sp-layout-with-sidebar,
  .sp-layout-with-sidebar.sp-sidebar-left,
  .sidebar-layout{
    width:100%;
    max-width:100%;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:14px;
    padding-right:14px;
    box-sizing:border-box;
    display:block;
  }

  .sp-main-content{
    width:100%;
    max-width:100%;
    min-width:0;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box;
  }

  .single-wrap,
  .single-wrap.sp-single-modern,
  body.spillph-article-fullwidth .single-wrap,
  body.spillph-article-reading_mode .single-wrap,
  .sp-layout-fullwidth .single-wrap{
    width:100%;
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:18px!important;
    padding-right:18px!important;
    box-sizing:border-box;
  }

  .sp-single-modern .single-featured-image,
  .single-featured-image{
    margin-left:-18px!important;
    margin-right:-18px!important;
    width:auto;
  }

  .sp-single-modern .sp-single-title,
  .single-wrap h1,
  .sp-single-title{
    font-size:clamp(30px,9vw,42px)!important;
    line-height:1.05!important;
    letter-spacing:-1.4px!important;
    max-width:100%;
    overflow-wrap:break-word;
    word-break:normal;
  }

  .article-content,
  .sp-post-meta-line,
  .sp-article-share-wrap,
  .sp-comments-section,
  .author-box,
  .post-navigation{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
  }

  .article-content img,
  .article-content iframe,
  .article-content video,
  .article-content table,
  .wp-block-image img,
  .wp-block-embed,
  .wp-block-table{
    max-width:100%!important;
    height:auto;
  }

  .article-content{
    overflow-wrap:break-word;
  }

  .sp-sidebar-area{
    width:100%;
    max-width:100%;
    margin-top:22px;
    box-sizing:border-box;
  }
}

.latest-stories-list{display:flex;flex-direction:column;gap:22px}
.latest-story-item{display:grid;grid-template-columns:260px 1fr;gap:18px;align-items:start;padding-bottom:18px;border-bottom:1px solid #e5e7eb}
.latest-story-thumb img{width:100%;height:150px;object-fit:cover;border-radius:12px}
.latest-story-cat{display:inline-block;background:#ff2b2b;color:#fff;padding:4px 8px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase}
.latest-story-title{
  margin:8px 0;
  color:var(--sp-post-title-homepage-color,#111);
  font-family:var(--sp-post-title-homepage-font,var(--heading-font));
  font-size:var(--sp-post-title-homepage-size,34px);
  font-weight:var(--sp-post-title-homepage-weight,900);
  font-style:var(--sp-post-title-homepage-style,normal);
  text-decoration:var(--sp-post-title-homepage-decoration,none);
  line-height:1.08;
}
.latest-story-title a{
  color:var(--sp-latest-story-title-link-color, inherit) !important;
  font-family:inherit !important;
  font-size:inherit !important;
  font-weight:inherit !important;
  font-style:inherit !important;
  text-decoration:var(--sp-latest-story-title-link-decoration, inherit) !important;
  transition:color .2s ease, text-decoration-color .2s ease;
}
.latest-story-title a:hover,
.latest-story-title a:focus{
  color:var(--sp-latest-story-title-link-hover-color, var(--sp-latest-story-title-link-color, inherit)) !important;
  text-decoration:var(--sp-latest-story-title-link-hover-decoration, var(--sp-latest-story-title-link-decoration, inherit)) !important;
}
body.spillph-dark .latest-story-title{color:var(--sp-post-title-homepage-color,#f4f4f5) !important}
body.spillph-dark .latest-story-title a{color:var(--sp-latest-story-title-link-color, var(--sp-post-title-homepage-color,#f4f4f5)) !important}
body.spillph-dark .latest-story-title a:hover, body.spillph-dark .latest-story-title a:focus{color:var(--sp-latest-story-title-link-hover-color, var(--sp-latest-story-title-link-color, var(--sp-post-title-homepage-color,#f4f4f5))) !important}
.latest-story-meta{font-size:13px;color:#666}
.latest-story-excerpt{margin-top:8px;color:#444;line-height:1.6}
@media(max-width:768px){.latest-story-item{grid-template-columns:1fr}.latest-story-title{font-size:clamp(22px, calc(var(--sp-post-title-homepage-size,34px) * .78), var(--sp-post-title-homepage-size,34px))}}

/* SpillPH v4.5.5 Typography Letter Gap */
.sp-share-btn,.sp-share-button,.article-share a{letter-spacing:var(--sp-share-button-letter-spacing,0px)!important}


/* SpillPH v4.5.13 Hero Grid Link Styling */
.hero-grid .hero-content h1 a{
  color:var(--sp-hero-grid-main-link-color,#fff) !important;
  text-decoration:var(--sp-hero-grid-main-link-decoration,none) !important;
  transition:color .2s ease,text-decoration-color .2s ease;
}
.hero-grid .hero-content h1 a:hover,
.hero-grid .hero-content h1 a:focus{
  color:var(--sp-hero-grid-main-link-hover-color,var(--sp-hero-grid-main-link-color,#fff)) !important;
  text-decoration:var(--sp-hero-grid-main-link-hover-decoration,var(--sp-hero-grid-main-link-decoration,none)) !important;
}
.hero-grid .side-card .news-title a{
  color:var(--sp-hero-grid-secondary-link-color,#fff) !important;
  text-decoration:var(--sp-hero-grid-secondary-link-decoration,none) !important;
  transition:color .2s ease,text-decoration-color .2s ease;
}
.hero-grid .side-card .news-title a:hover,
.hero-grid .side-card .news-title a:focus{
  color:var(--sp-hero-grid-secondary-link-hover-color,var(--sp-hero-grid-secondary-link-color,#fff)) !important;
  text-decoration:var(--sp-hero-grid-secondary-link-hover-decoration,var(--sp-hero-grid-secondary-link-decoration,none)) !important;
}


/* Footer Logo */
.sp-footer-logo{margin:0 0 18px;display:flex;align-items:center;width:100%;}
.sp-footer-logo-left{justify-content:flex-start;}
.sp-footer-logo-center{justify-content:center;}
.sp-footer-logo-right{justify-content:flex-end;}
.sp-footer-logo img{display:block;height:auto;max-height:120px;object-fit:contain;}
@media(max-width:700px){.sp-footer-logo{justify-content:center!important}.sp-footer-logo img{max-width:180px!important}}


/* SpillPH Article Elements Toolkit v4.6.2 - Article-width media normalization */
.article-content > .wp-block-embed,
.article-content > .wp-block-image,
.article-content > .wp-block-video,
.article-content > .wp-block-audio,
.article-content > .sp-element,
.article-content > figure,
.article-content > iframe,
.article-content > video,
.article-content > audio,
.article-content > object,
.article-content > embed{
  width:100%!important;
  max-width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box;
}
.article-content iframe,
.article-content video,
.article-content audio,
.article-content object,
.article-content embed,
.article-content .wp-block-embed__wrapper,
.article-content .wp-block-embed__wrapper > iframe,
.article-content .wp-block-embed__wrapper > blockquote,
.article-content .wp-block-embed__wrapper > div,
.article-content .instagram-media,
.article-content .twitter-tweet,
.article-content .tiktok-embed,
.article-content .fb-post,
.article-content .fb-video{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box;
}
.article-content .wp-block-embed.is-type-video .wp-block-embed__wrapper,
.article-content .wp-block-embed-youtube .wp-block-embed__wrapper,
.article-content .wp-block-embed-vimeo .wp-block-embed__wrapper{
  position:relative;
  width:100%!important;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:var(--sp-global-radius,14px);
  background:#0f172a;
}
.article-content .wp-block-embed.is-type-video .wp-block-embed__wrapper iframe,
.article-content .wp-block-embed-youtube .wp-block-embed__wrapper iframe,
.article-content .wp-block-embed-vimeo .wp-block-embed__wrapper iframe{
  position:absolute;
  inset:0;
  width:100%!important;
  height:100%!important;
  border:0;
}
.article-content .wp-block-image img,
.article-content figure img,
.article-content .sp-element-photo img{
  width:100%;
  max-width:100%!important;
  height:auto;
  margin-left:auto;
  margin-right:auto;
}
.sp-element{width:100%;max-width:100%;margin:28px auto;box-sizing:border-box}.sp-element figcaption{margin-top:9px;text-align:center;color:#64748b;font-size:13px}.sp-element-photo{display:flex;flex-direction:column;align-items:center}.sp-element-photo a{display:block;width:100%;max-width:100%}.sp-element-photo img{border-radius:var(--sp-global-radius,14px);box-shadow:0 18px 45px rgba(15,23,42,.12)}.sp-element-audio{border:1px solid #e5e7eb;border-radius:var(--sp-global-radius,14px);background:#fff;padding:14px;box-shadow:0 12px 28px rgba(15,23,42,.06)}.sp-element-audio-inner,.sp-element-oembed-inner{width:100%;max-width:100%;margin-left:auto;margin-right:auto}.sp-element-audio iframe{width:100%!important;max-width:100%!important;border:0;border-radius:12px}.sp-element-audio-frame{height:152px}.sp-element-audio-link{display:block;width:100%;padding:14px 16px;border-radius:12px;background:#f8fafc;font-weight:800;color:var(--accent,#e11d48);word-break:break-word}.sp-element-video-frame{position:relative;width:100%;max-width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--sp-global-radius,14px);background:#0f172a;box-shadow:0 18px 45px rgba(15,23,42,.16)}.sp-element-video-frame iframe{position:absolute;inset:0;width:100%!important;height:100%!important;border:0}.sp-element-embed{display:flex;flex-direction:column;align-items:center}.sp-element-embed iframe,.sp-element-embed blockquote,.sp-element-embed .instagram-media,.sp-element-embed .twitter-tweet,.sp-element-embed .tiktok-embed{width:100%!important;max-width:100%!important;min-width:0!important;margin-left:auto!important;margin-right:auto!important}.sp-element-quote{border-left:5px solid var(--accent,#e11d48);background:#fff7ed;border-radius:0 var(--sp-global-radius,14px) var(--sp-global-radius,14px) 0;padding:20px 22px;color:#111827}.sp-element-quote p{font-size:1.18em;line-height:1.55;font-weight:700;margin:0}.sp-element-quote cite{display:block;margin-top:12px;color:#64748b;font-style:normal;font-weight:700}.sp-element-takeaways{border:1px solid #e5e7eb;border-radius:var(--sp-global-radius,14px);background:#f8fafc;padding:20px 22px;box-shadow:0 12px 28px rgba(15,23,42,.06)}.sp-element-takeaways h3{margin:0 0 12px;font-size:18px}.sp-element-takeaways ul{margin:0;padding-left:20px}.sp-element-takeaways li{margin:8px 0}.sp-element-related{border:1px solid #e5e7eb;border-radius:var(--sp-global-radius,14px);background:#fff;overflow:hidden;box-shadow:0 12px 28px rgba(15,23,42,.06)}.sp-element-related-link{display:flex;align-items:center;gap:16px;padding:13px;color:inherit;text-decoration:none}.sp-element-related-thumb{width:112px;aspect-ratio:16/10;border-radius:12px;overflow:hidden;flex:0 0 auto;background:#e5e7eb}.sp-element-related-thumb img{width:100%;height:100%;object-fit:cover;display:block}.sp-element-related-body strong{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--accent,#e11d48);margin-bottom:5px}.sp-element-related-body span{font-weight:800;line-height:1.35}.sp-element-source{border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;padding:12px 0;color:#475569;font-size:14px}.sp-element-source a{font-weight:700}.sp-element-divider{border:0;border-top:1px solid #e5e7eb;margin:32px auto;width:72%}@media(max-width:640px){.sp-element-related-link{align-items:flex-start}.sp-element-related-thumb{width:88px}.sp-element-quote p{font-size:1.06em}}


/* SpillPH v4.6.3 - Featured Image article visibility helper */
.sp-featured-hidden-note{
  margin: 0 0 18px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px dashed #cbd5e1;
  color: #64748b;
  font-size: 13px;
}

/* =====================================================
   SPILLPH v5.1.0 Trend Engine & Trending Now Redesign
   ===================================================== */
.sp-trend-engine{
  overflow:hidden;
}

.sp-trend-engine{
  background:var(--sp-trend-engine-container-bg, transparent);
}

.sp-trending-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
  border-bottom:1px solid var(--sp-trend-engine-border-color, rgba(15,23,42,.08));
  padding-bottom:12px;
}
.sp-trending-head .trending-title{
  margin:0!important;
  display:flex;
  align-items:center;
  gap:8px;
  line-height:var(--sp-trend-engine-title-line-height,1.1);
  font-family:var(--sp-trend-engine-title-font,var(--heading-font));
  font-size:var(--sp-trend-engine-title-size,24px);
  font-weight:var(--sp-trend-engine-title-weight,900);
  font-style:var(--sp-trend-engine-title-style,normal);
  color:var(--sp-trend-engine-title-color,#0f172a);
  letter-spacing:var(--sp-trend-engine-title-letter-spacing,0);
  text-decoration:var(--sp-trend-engine-title-decoration,none);
}
.sp-trending-updated{
  color:var(--sp-trend-engine-updated-color,#64748b);
  font-family:var(--sp-trend-engine-updated-font,var(--body-font));
  font-size:var(--sp-trend-engine-updated-size,11px);
  font-weight:var(--sp-trend-engine-updated-weight,800);
  font-style:var(--sp-trend-engine-updated-style,normal);
  letter-spacing:var(--sp-trend-engine-updated-letter-spacing,0);
  text-decoration:var(--sp-trend-engine-updated-decoration,none);
  white-space:nowrap;
  margin-top:2px;
}
.sp-trending-list{
  display:grid;
  gap:0;
}
.sp-trending-item{
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  gap:12px;
  padding:13px 0;
  border-bottom:1px solid var(--sp-trend-engine-border-color, rgba(15,23,42,.08));
}
.sp-trending-item:last-child{border-bottom:0;padding-bottom:0}
.sp-trending-thumb{
  width:64px;
  height:64px;
  display:block;
  overflow:hidden;
  background:var(--sp-trend-engine-thumbnail-bg, linear-gradient(135deg,rgba(255,43,43,.16),rgba(15,23,42,.12)));
  border-radius:var(--sp-trend-engine-thumbnail-radius,14px)!important;
}
.sp-trending-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.sp-trending-content{min-width:0}
.sp-trending-kicker{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin-bottom:5px;
}
.sp-trending-cat,
.sp-trending-new{
  display:inline-flex;
  align-items:center;
  border-radius:999px!important;
  font-size:var(--sp-trend-engine-category-size,10px);
  font-weight:var(--sp-trend-engine-category-weight,900);
  font-family:var(--sp-trend-engine-category-font,var(--body-font));
  font-style:var(--sp-trend-engine-category-style,normal);
  line-height:1;
  letter-spacing:var(--sp-trend-engine-category-letter-spacing,.02em);
  padding:5px 7px;
  text-transform:uppercase;
}
.sp-trending-cat{
  color:var(--sp-trend-engine-category-color,var(--accent,#ff2b2b));
  background:rgba(255,43,43,.09);
}
.sp-trending-new{
  color:#047857;
  background:#d1fae5;
}
.sp-trending-content h4{
  margin:0;
  font-family:var(--sp-trend-engine-article-title-font,var(--heading-font));
  font-size:var(--sp-trend-engine-article-title-size,14px);
  line-height:1.28;
  font-weight:var(--sp-trend-engine-article-title-weight,900);
  font-style:var(--sp-trend-engine-article-title-style,normal);
  letter-spacing:var(--sp-trend-engine-article-title-letter-spacing,-.02em);
}
.sp-trending-content h4 a{
  color:var(--sp-trend-engine-article-title-color,inherit);
  text-decoration:var(--sp-trend-engine-article-title-decoration,none);
}
.sp-trending-content h4 a:hover{
  color:var(--accent,#ff2b2b);
}
.sp-trending-meta{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  margin-top:7px;
  color:var(--sp-trend-engine-meta-color,#64748b);
  font-family:var(--sp-trend-engine-meta-font,var(--body-font));
  font-size:var(--sp-trend-engine-meta-size,11px);
  font-weight:var(--sp-trend-engine-meta-weight,800);
  font-style:var(--sp-trend-engine-meta-style,normal);
  letter-spacing:var(--sp-trend-engine-meta-letter-spacing,0);
}
.sp-trending-meta i{font-size:10px;color:var(--accent,#ff2b2b)}
.sp-trending-text_only .sp-trending-item{grid-template-columns:1fr;padding:14px 0}
.sp-trending-text_only .sp-trending-thumb{display:none}
.sp-trending-premium_card .sp-trending-list{gap:12px}
.sp-trending-premium_card .sp-trending-item{
  border:1px solid var(--sp-trend-engine-border-color, rgba(15,23,42,.08));
  border-radius:var(--sp-trend-engine-card-radius,18px)!important;
  padding:12px;
  background:var(--sp-trend-engine-card-bg,#fff);
  box-shadow:var(--sp-trend-engine-card-shadow,0 8px 22px rgba(15,23,42,.04));
}
.sp-trending-empty{margin:0;color:#64748b;font-weight:700;line-height:1.5}
body.spillph-dark .sp-trending-head,
body.spillph-dark .sp-trending-item{border-color:rgba(255,255,255,.10)}
body.spillph-dark .sp-trending-premium_card .sp-trending-item{background:#1c1c1f;border-color:#333}
body.spillph-dark .sp-trending-updated,
body.spillph-dark .sp-trending-meta,
body.spillph-dark .sp-trending-empty{color:#a1a1aa}
@media(max-width:760px){
  
.sp-trend-engine{
  background:var(--sp-trend-engine-container-bg, transparent);
}

.sp-trending-head{align-items:flex-start;flex-direction:column;gap:4px}
  .sp-trending-updated{white-space:normal}
  .sp-trending-item{grid-template-columns:72px minmax(0,1fr)}
  .sp-trending-thumb{width:72px;height:72px}
}


/* SPILLPH v6.0.7 - Verified Instant Mode sticky header fix
   Uses the shell as a 54px spacer and fixes only the topbar to the viewport.
   This avoids WordPress/theme wrapper issues that can break position: sticky. */
.sp-instant-mode-active .sp-instant-shell.sp-instant-header-sticky{
  position:relative!important;
  top:auto!important;
  z-index:auto!important;
  height:54px!important;
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  background:var(--sp-instant-header-bg,#fff)!important;
}
.sp-instant-mode-active .sp-instant-shell.sp-instant-header-sticky .sp-instant-topbar{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  z-index:10050!important;
  width:100vw!important;
  max-width:none!important;
  margin:0!important;
  border-radius:0!important;
  background:var(--sp-instant-header-bg,#fff)!important;
  color:var(--sp-instant-header-text,#111)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.08)!important;
}
.admin-bar.sp-instant-mode-active .sp-instant-shell.sp-instant-header-sticky .sp-instant-topbar{top:32px!important;}
@media(max-width:782px){.admin-bar.sp-instant-mode-active .sp-instant-shell.sp-instant-header-sticky .sp-instant-topbar{top:46px!important;}}
.sp-instant-mode-active .sp-instant-shell.sp-instant-header-static .sp-instant-topbar{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
}

/* SPILLPH v6.0.22 - Instant Header Styling */
.sp-instant-mode-active .sp-instant-topbar{background:var(--sp-instant-header-bg,#fff)!important;color:var(--sp-instant-header-text,#111)!important;}
.sp-instant-mode-active .sp-instant-topbar .sp-instant-logo,.sp-instant-mode-active .sp-instant-topbar button,.sp-instant-mode-active .sp-instant-topbar i{color:var(--sp-instant-header-text,#111)!important;}
.sp-instant-mode-active .sp-instant-menu-button,.sp-instant-mode-active .sp-instant-search{background:rgba(127,127,127,.14)!important;}


/* SPILLPH v6.0.23 - Instant Header Background Application Fix */
.sp-instant-mode-active .sp-instant-shell,
.sp-instant-mode-active .sp-instant-shell.sp-instant-header-sticky,
.sp-instant-mode-active .sp-instant-shell.sp-instant-header-static,
.sp-instant-mode-active [data-sp-instant-header],
.sp-instant-mode-active .sp-instant-topbar{
  background-color:var(--sp-instant-header-bg,#fff)!important;
  background:var(--sp-instant-header-bg,#fff)!important;
}
.sp-instant-mode-active .sp-instant-topbar *,
.sp-instant-mode-active .sp-instant-logo,
.sp-instant-mode-active .sp-instant-menu-button,
.sp-instant-mode-active .sp-instant-search{
  color:var(--sp-instant-header-text,#111)!important;
}