/*
Theme Name: myRekomen Video
Theme URI: https://www.youtube.com/@myRekomen/videos
Author: myRekomen
Description: An original dark video portal theme inspired by modern video magazine layouts.
Version: 1.0.0
Text Domain: myrekom-video
*/
:root{--bg:#080b10;--surface:#111720;--surface-2:#171f2b;--line:#26303d;--text:#f5f7fb;--muted:#9ba7b7;--accent:#f2c300;--accent-2:#ffd84d;--max:1240px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}.site-shell{min-height:100vh;background:radial-gradient(circle at 75% 0%,rgba(242,195,0,.10),transparent 36%),var(--bg)}
.container{width:min(calc(100% - 40px),var(--max));margin:auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(8,11,16,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.07)}.header-inner{height:74px;display:flex;align-items:center;gap:28px}.brand{font-size:22px;font-weight:900;letter-spacing:-.04em;white-space:nowrap}.brand-mark{display:inline-grid;place-items:center;width:30px;height:30px;margin-right:9px;border-radius:9px;background:linear-gradient(135deg,var(--accent),#ffd84d);font-size:13px;vertical-align:middle}.brand-logo{display:inline-block;width:30px;height:30px;margin-right:9px;border-radius:9px;object-fit:cover;vertical-align:middle;box-shadow:0 0 0 1px rgba(255,255,255,.12)}.main-nav{display:flex;gap:22px;margin-left:auto;color:var(--muted);font-weight:700}.main-nav a:hover,.main-nav .current-menu-item a{color:var(--text)}.header-actions{display:flex;gap:10px;align-items:center}.icon-link{color:var(--muted);font-size:18px}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:8px;padding:11px 17px;background:var(--accent);color:#11151b;font-weight:800;cursor:pointer;transition:.2s}.button:hover{filter:brightness(1.08) saturate(1.08);transform:translateY(-1px)}.button.alt{background:var(--surface-2);border:1px solid var(--line)}
.hero{position:relative;overflow:hidden;min-height:470px;display:flex;align-items:end;background:linear-gradient(90deg,rgba(8,11,16,.98) 0%,rgba(8,11,16,.72) 42%,rgba(8,11,16,.15) 100%),linear-gradient(0deg,rgba(8,11,16,.98),transparent 45%),url('https://i.ytimg.com/vi/DOCcgf1nxaA/maxresdefault.jpg') center/cover}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,11,16,.25),transparent 55%);pointer-events:none}.hero-content{position:relative;z-index:1;padding:84px 0 56px;max-width:650px}.eyebrow{color:var(--accent-2);font-size:12px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}.hero h1{font-size:clamp(34px,5vw,66px);line-height:1.02;letter-spacing:-.06em;margin:13px 0 18px}.hero p{max-width:560px;color:#c2cad5;font-size:17px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.play{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#111;font-size:13px}
.section{padding:38px 0}.hero + .section{padding-top:28px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:20px}.section-title{margin:0;font-size:25px;letter-spacing:-.04em}.section-note{margin:4px 0 0;color:var(--muted)}.section-link{color:var(--accent-2);font-weight:800}.feed-panel{min-height:160px;padding:10px;border:1px solid var(--line);border-radius:14px;background:rgba(17,23,32,.68)}.feed-panel .sw-youtube,.feed-panel .sw-youtube-container{color:var(--text)}.shorts-panel{padding:10px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(135deg,rgba(242,195,0,.14),rgba(255,216,77,.06))}.shorts-panel .sw-youtube{min-height:260px}.shorts-fallback{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.short-card{overflow:hidden;border-radius:10px;background:var(--surface);border:1px solid var(--line)}.short-card img{display:block;width:100%;aspect-ratio:9/16;object-fit:cover}.short-card span{display:block;padding:8px 9px;font-size:12px;font-weight:800}
.feature-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.feature-card{position:relative;min-height:270px;overflow:hidden;border-radius:14px;border:1px solid var(--line);background:var(--surface)}.feature-card img{width:100%;height:100%;object-fit:cover;opacity:.76}.feature-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.9),transparent 70%)}.feature-card-content{position:absolute;z-index:1;left:24px;right:24px;bottom:20px}.feature-card h3{margin:7px 0;font-size:24px;line-height:1.1}.mini-stack{display:grid;gap:12px}.mini-card{display:flex;min-height:127px;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.mini-card img{width:42%;object-fit:cover}.mini-card div{padding:14px}.mini-card h3{margin:4px 0;font-size:16px;line-height:1.2}.mini-card p{margin:0;color:var(--muted);font-size:12px}
.site-footer{padding:34px 0;margin-top:24px;border-top:1px solid var(--line);color:var(--muted)}.footer-inner{display:flex;justify-content:space-between;gap:20px}.footer-inner strong{color:var(--text)}.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);height:1px;width:1px;overflow:hidden}.notice{padding:18px;border:1px dashed #75631f;border-radius:12px;color:#ffe98a;background:rgba(242,195,0,.07)}.ad-below-hero{padding:22px 0 10px}.ad-slot-label{text-align:center;color:var(--muted);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}.ad-slot{display:flex;justify-content:center;align-items:center;min-height:90px}.ad-slot img[src*="/dummy.jpg"]{display:block;width:min(100%,728px);height:90px;object-fit:fill}
.video-page-head{padding-bottom:10px}.page-title{margin:10px 0 6px;font-size:clamp(36px,5vw,64px);line-height:1;letter-spacing:-.06em}.video-library{padding-top:10px}.video-wall{padding:14px;border:1px solid var(--line);border-radius:14px;background:rgba(17,23,32,.68);overflow:hidden}.video-wall .sw-youtube{color:var(--text)}.video-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.video-card{display:block;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--surface);transition:transform .2s,border-color .2s}.video-card:hover{transform:translateY(-3px);border-color:var(--accent)}.video-card-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--surface-2)}.video-card-thumb img{display:block;width:100%;height:100%;object-fit:cover}.video-card-play{position:absolute;left:12px;bottom:10px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#11151b;font-size:12px}.video-card-body{padding:12px 14px 14px}.video-card-body h3{margin:0;color:var(--text);font-size:15px;line-height:1.3}.video-card-body p{margin:7px 0 0;color:var(--muted);font-size:12px}
/* Facebook page: masonry layout. */
.facebook-page-feed .esf-facebook-feed__full-width-inner,.facebook-page-feed .esf-facebook-feed__half-width-inner,.facebook-page-feed .esf-facebook-feed__masonry-inner{display:block!important;column-count:3;column-gap:18px}.facebook-page-feed .esf-facebook-feed__full-width-cell,.facebook-page-feed .esf-facebook-feed__half-width-cell,.facebook-page-feed .esf-facebook-feed__stacked-card{display:inline-block;width:100%;margin:0 0 18px;vertical-align:top;break-inside:avoid;page-break-inside:avoid}.facebook-page-feed .esf-facebook-feed__full-width-cell>*,.facebook-page-feed .esf-facebook-feed__half-width-cell>*{width:100%}.facebook-page-feed .esf-facebook-feed__header,.facebook-page-feed .esf-facebook-feed__load-more-wrap,.facebook-page-feed .esf-facebook-feed__follow-wrap{column-span:all}
/* Facebook page: dark presentation. */
.facebook-page-feed .esf-facebook-feed{--esf-facebook-stacked-bg:#111720;--esf-facebook-stacked-content-bg:#111720;--esf-facebook-stacked-footer-bg:#171f2b;--esf-facebook-stacked-text:#f5f7fb;--esf-facebook-stacked-footer-fg:#9ba7b7;--esf-facebook-stacked-border:#26303d;--esf-facebook-primary:#4d8dff;color:#f5f7fb;background:transparent}.facebook-page-feed .esf-facebook-feed__stacked-card,.facebook-page-feed .esf-facebook-feed__full-width-cell,.facebook-page-feed .esf-facebook-feed__half-width-cell{background:#111720;border-color:#26303d;color:#f5f7fb;box-shadow:0 8px 24px rgba(0,0,0,.22)}.facebook-page-feed .esf-facebook-feed__stacked-content,.facebook-page-feed .esf-facebook-feed__stacked-content--header,.facebook-page-feed .esf-facebook-feed__stacked-content--caption{background:#111720;color:#f5f7fb}.facebook-page-feed .esf-facebook-feed__stacked-status,.facebook-page-feed .esf-facebook-feed__stacked-time,.facebook-page-feed .esf-facebook-feed__caption-preview,.facebook-page-feed .esf-facebook-feed__caption-full,.facebook-page-feed .esf-facebook-feed__header-meta,.facebook-page-feed .esf-facebook-feed__header-bio{color:#9ba7b7}.facebook-page-feed .esf-facebook-feed__stacked-name,.facebook-page-feed .esf-facebook-feed__stacked-name-link,.facebook-page-feed .esf-facebook-feed__header-name,.facebook-page-feed .esf-facebook-feed__header-handle{color:#f5f7fb}.facebook-page-feed .esf-facebook-feed__link-card{background:#171f2b;border-color:#26303d;color:#f5f7fb}.facebook-page-feed .esf-facebook-feed__link-card-title,.facebook-page-feed .esf-facebook-feed__view-on-fb,.facebook-page-feed .esf-facebook-feed__load-more{color:#7eaeff}.facebook-page-feed .esf-facebook-feed__footer,.facebook-page-feed .esf-facebook-feed__footer-actions,.facebook-page-feed .esf-facebook-feed__load-more-wrap{background:#0d1219;border-color:#26303d}.facebook-page-feed .esf-facebook-feed__header{background:#111720;border-color:#26303d}.facebook-page-feed .esf-facebook-feed__follow,.facebook-page-feed .esf-facebook-feed__header-follow{background:#1877f2;color:#fff}.facebook-page-feed .esf-facebook-feed__empty{background:#111720;border-color:#26303d;color:#9ba7b7}
/* Facebook split cards and action bar. */
.facebook-page-feed .esf-facebook-feed__split-card,.facebook-page-feed .esf-facebook-feed__split-main,.facebook-page-feed .esf-facebook-feed__split-content,.facebook-page-feed .esf-facebook-feed__split-header,.facebook-page-feed .esf-facebook-feed__split-footer,.facebook-page-feed .esf-facebook-feed__split-footer-actions,.facebook-page-feed .esf-facebook-feed__split-footer-metrics,.facebook-page-feed .esf-facebook-feed__stacked-footer,.facebook-page-feed .esf-facebook-feed__stacked-footer-actions,.facebook-page-feed .esf-facebook-feed__stacked-footer-metrics{background:#111720!important;color:#f5f7fb!important;border-color:#26303d!important}.facebook-page-feed .esf-facebook-feed__split-status,.facebook-page-feed .esf-facebook-feed__split-time,.facebook-page-feed .esf-facebook-feed__split-name,.facebook-page-feed .esf-facebook-feed__split-name-link,.facebook-page-feed .esf-facebook-feed__split-content p,.facebook-page-feed .esf-facebook-feed__split-content span,.facebook-page-feed .esf-facebook-feed__split-content div{color:#f5f7fb}.facebook-page-feed .esf-facebook-feed__split-status,.facebook-page-feed .esf-facebook-feed__split-time{color:#9ba7b7}.facebook-page-feed .esf-facebook-feed__split-footer a,.facebook-page-feed .esf-facebook-feed__split-footer button,.facebook-page-feed .esf-facebook-feed__stacked-footer a,.facebook-page-feed .esf-facebook-feed__stacked-footer button{background:#171f2b!important;color:#dbe7ff!important;border-color:#26303d!important}.facebook-page-feed .esf-facebook-feed__split-footer svg,.facebook-page-feed .esf-facebook-feed__stacked-footer svg{color:#dbe7ff!important;fill:currentColor}.facebook-page-feed .esf-facebook-feed__split-footer,.facebook-page-feed .esf-facebook-feed__stacked-footer{display:flex!important;flex-wrap:wrap!important;align-items:center;gap:7px;min-width:0;max-width:100%;overflow:hidden;padding:9px 10px!important}.facebook-page-feed .esf-facebook-feed__split-footer-metrics,.facebook-page-feed .esf-facebook-feed__split-footer-actions,.facebook-page-feed .esf-facebook-feed__stacked-footer-metrics,.facebook-page-feed .esf-facebook-feed__stacked-footer-actions{display:flex!important;flex:1 1 auto;flex-wrap:wrap!important;align-items:center;gap:5px!important;min-width:0;max-width:100%}.facebook-page-feed .esf-facebook-feed__split-footer a,.facebook-page-feed .esf-facebook-feed__split-footer button,.facebook-page-feed .esf-facebook-feed__stacked-footer a,.facebook-page-feed .esf-facebook-feed__stacked-footer button{min-width:0;max-width:100%;padding:7px 10px!important;font-size:12px!important;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.facebook-page-feed .esf-facebook-feed__split-footer-metrics>*,.facebook-page-feed .esf-facebook-feed__stacked-footer-metrics>*{flex:0 0 auto;font-size:12px;white-space:nowrap}
/* Facebook header count. */
.facebook-page-feed .esf-facebook-feed__header-stat-count,.facebook-page-feed .esf-facebook-feed__header-stat-value,.facebook-page-feed .esf-facebook-feed__header-meta-icon-value,.facebook-page-feed .esf-facebook-feed__header-stats strong,.facebook-page-feed .esf-facebook-feed__header-stat,.facebook-page-feed .esf-facebook-feed__header-stat-label{color:#fff!important;font-weight:800}
@media(max-width:900px){.main-nav{display:none}.feature-grid{grid-template-columns:1fr}.shorts-fallback{grid-template-columns:repeat(3,1fr)}.hero{min-height:420px}.hero-content{padding-top:96px}.video-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.facebook-page-feed .esf-facebook-feed__full-width-inner,.facebook-page-feed .esf-facebook-feed__half-width-inner,.facebook-page-feed .esf-facebook-feed__masonry-inner{column-count:2}}
@media(max-width:560px){.container{width:min(calc(100% - 24px),var(--max))}.header-inner{height:64px;gap:14px}.header-actions .button{padding:9px 11px;font-size:12px}.brand-logo{width:28px;height:28px;margin-right:7px}.hero{min-height:360px}.hero-content{padding-top:72px;padding-bottom:38px}.hero h1{font-size:39px}.shorts-fallback{grid-template-columns:repeat(2,1fr)}.footer-inner{display:block}.footer-inner>*{margin:8px 0}.video-card-grid{grid-template-columns:1fr}.facebook-page-feed .esf-facebook-feed__full-width-inner,.facebook-page-feed .esf-facebook-feed__half-width-inner,.facebook-page-feed .esf-facebook-feed__masonry-inner{column-count:1}.facebook-page-feed .esf-facebook-feed__split-footer,.facebook-page-feed .esf-facebook-feed__stacked-footer{gap:5px;padding:8px!important}.facebook-page-feed .esf-facebook-feed__split-footer a,.facebook-page-feed .esf-facebook-feed__split-footer button,.facebook-page-feed .esf-facebook-feed__stacked-footer a,.facebook-page-feed .esf-facebook-feed__stacked-footer button{padding:6px 8px!important;font-size:11px!important}}

/* Keep text readable on dark secondary buttons after the yellow accent update. */
.button.alt,
.hero-actions .button.alt {
  color: var(--text);
}
.button.alt:hover,
.hero-actions .button.alt:hover {
  color: #ffffff;
}

/* Dynamic hero background supplied by the latest long-form YouTube video. */
.hero {
  background-image:
    linear-gradient(90deg,rgba(8,11,16,.98) 0%,rgba(8,11,16,.72) 42%,rgba(8,11,16,.15) 100%),
    linear-gradient(0deg,rgba(8,11,16,.98),transparent 45%),
    var(--hero-image, url('https://i.ytimg.com/vi/DOCcgf1nxaA/maxresdefault.jpg'));
  background-position: center, center, center;
  background-size: cover, cover, cover;
}

/* Hiburan news page */
.entertainment-hero { padding-bottom: 28px; }
.entertainment-news { padding-top: 20px; }
.section-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.entertainment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.entertainment-card { overflow: hidden; background: #111822; border: 1px solid rgba(255,255,255,.10); border-radius: 16px; box-shadow: 0 14px 32px rgba(0,0,0,.16); }
.entertainment-card-image { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #202a36; }
.entertainment-card-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.entertainment-card:hover .entertainment-card-image img { transform: scale(1.04); }
.entertainment-card-body { padding: 20px; }
.entertainment-card-meta { margin: 0 0 8px; color: #f2c400; font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.entertainment-card h3 { margin: 0 0 10px; font-size: 1.18rem; line-height: 1.25; }
.entertainment-card h3 a { color: inherit; text-decoration: none; }
.entertainment-card-body > p:not(.entertainment-card-meta) { margin: 0 0 16px; color: #aeb8c5; line-height: 1.6; }
.entertainment-read-more { color: #f2c400; font-weight: 700; text-decoration: none; }
.entertainment-read-more span { display: inline-block; margin-left: 4px; }
@media (max-width: 850px) { .entertainment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .entertainment-grid { grid-template-columns: 1fr; } }

/* WordPress menu presentation: preserve the original horizontal header design. */
.main-nav .primary-menu{display:flex;align-items:center;gap:22px;margin:0;padding:0;list-style:none}.main-nav .primary-menu li{display:block;margin:0;padding:0;list-style:none}.main-nav .primary-menu a{display:block;color:var(--muted);font-weight:700;white-space:nowrap}.main-nav .primary-menu a:hover,.main-nav .primary-menu .current-menu-item>a,.main-nav .primary-menu .current_page_item>a{color:var(--text)}

/* Keep the primary navigation stable while jumping to homepage anchors. */
.site-header .header-inner{min-height:74px;height:74px}.main-nav{flex:0 0 auto;font-size:15px;line-height:1.2}.main-nav .primary-menu{flex:0 0 auto;align-items:center}.main-nav .primary-menu li{flex:0 0 auto}.main-nav .primary-menu a{font-size:15px;line-height:1.2;transform:none}.header-actions{flex:0 0 auto}#videos,#shorts{scroll-margin-top:90px}
@media(max-width:900px){.site-header .header-inner{height:64px;min-height:64px}.main-nav{display:none}}

/* WordPress marks same-path hash links as active; use the actual browser hash instead. */
.main-nav .primary-menu .current-menu-item>a,.main-nav .primary-menu .current_page_item>a{color:var(--muted)}.main-nav .primary-menu a.is-current-anchor{color:var(--text)}

/* Stable header geometry: anchor navigation must not reflow the menu. */
.site-header .header-inner{display:grid;grid-template-columns:minmax(150px,1fr) auto auto;align-items:center;column-gap:28px;width:min(calc(100% - 40px),var(--max));white-space:nowrap}.site-header .brand{min-width:0;flex:none}.site-header .main-nav{display:block;min-width:0;margin-left:0;justify-self:end;flex:none}.site-header .primary-menu{display:flex!important;align-items:center;justify-content:flex-end;gap:22px;margin:0;padding:0;list-style:none}.site-header .primary-menu li,.site-header .primary-menu a{flex:none;transform:none;font-size:15px;line-height:1.2;font-weight:700}.site-header .header-actions{justify-self:end;display:flex;align-items:center;gap:10px;min-width:max-content;flex:none}.site-header .primary-menu a.is-current-anchor,.site-header .primary-menu a:hover{font-weight:700}
@media(max-width:900px){.site-header .header-inner{display:flex;width:min(calc(100% - 24px),var(--max));column-gap:14px}.site-header .main-nav{display:none}.site-header .header-actions{margin-left:auto}}

/* Final stable menu mode: active hash/current classes must not resize or recolor items. */
.site-header .primary-menu>li>a,.site-header .primary-menu>li.current-menu-item>a,.site-header .primary-menu>li.current_page_item>a,.site-header .primary-menu>li>a.is-current-anchor{display:block!important;color:var(--muted)!important;font-size:15px!important;font-weight:700!important;line-height:1.2!important;letter-spacing:0!important;padding:0!important;margin:0!important;transform:none!important}.site-header .primary-menu>li>a:hover{color:var(--text)!important}

/* Keep the sticky header below the logged-in WordPress admin bar at every scroll position. */
body.admin-bar .site-header{top:32px}body.admin-bar #wpadminbar{z-index:100000}.site-header{z-index:9999}
@media(max-width:782px){body.admin-bar .site-header{top:46px}}
