/*
Theme Name: Kengo. Official — VIDEO Carousel Editable Preview 2.3.0
Theme URI: https://kengomusic.com/
Author: Kengo.
Description: Kengo. official artist website theme. Editable in WordPress.
Version: 2.3.1
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: kengo-official
*/
:root{--ink:#111;--muted:#777;--paper:#fff;--soft:#f6f6f4;--line:#dededb;--max:1380px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Kaku Gothic ProN","Yu Gothic",Arial,sans-serif;line-height:1.7;font-weight:400}
a{color:inherit;text-decoration:none}
a:hover{opacity:.55}
.site-header{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:28px 4vw;color:#111;background:linear-gradient(to bottom,rgba(255,255,255,.92),rgba(255,255,255,0))}
.brand{font-family:Georgia,"Times New Roman",serif;font-size:34px;font-style:italic;letter-spacing:-1px}
.nav{display:flex;gap:25px;align-items:center;font-size:11px;letter-spacing:.16em;font-weight:700;text-transform:uppercase;white-space:nowrap}
.hero{min-height:720px;display:grid;grid-template-columns:38% 62%;background:#fff;overflow:hidden}
.hero-copy{padding:155px 6vw 80px 8vw;display:flex;flex-direction:column;justify-content:flex-start;background:var(--hero-bg,#eee3e3)}
.hero-copy h1{font-family:Georgia,"Times New Roman",serif;font-size:84px;line-height:1;margin:0 0 16px;font-weight:500;letter-spacing:-4px;color:var(--ink,#111)}
.eyebrow{font-size:12px;letter-spacing:.26em;margin:0 0 12px;font-weight:700;color:var(--ink,#111)}
.tagline{font-size:20px;line-height:2.1;max-width:360px}
.hero-media{min-height:720px;background:#eee;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;background:#eee}
.section{padding:90px 6vw}
.dark{background:#111;color:#fff}
.section-grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:220px 1fr;gap:70px}
.section-title{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Kaku Gothic ProN","Yu Gothic",Arial,sans-serif;font-size:52px;line-height:1;font-weight:800;letter-spacing:-.04em;margin:0}
.section-sub{font-size:11px;margin-top:12px;letter-spacing:.12em;opacity:.7}
.news-list{border-top:1px solid var(--line)}
.dark .news-list{border-color:rgba(255,255,255,.22)}
.news-item{display:grid;grid-template-columns:105px 80px 1fr 20px;gap:18px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line);font-size:14px}
.dark .news-item{border-color:rgba(255,255,255,.14)}
.date{font-size:11px;letter-spacing:.08em}
.tag{font-size:9px;letter-spacing:.14em;border:1px solid currentColor;padding:3px 8px;text-align:center}
.music{display:grid;grid-template-columns:220px 220px 1fr;gap:55px;align-items:center;max-width:var(--max);margin:0 auto}
.cover{width:220px;aspect-ratio:1;object-fit:cover}
.stream-links{display:flex;flex-wrap:wrap;gap:10px}
.stream-links a,.button{border:1px solid currentColor;padding:10px 15px;font-size:11px;letter-spacing:.06em;display:inline-block}
.video-banner{position:relative;min-height:360px;display:flex;align-items:center;padding:70px 8vw;background:#171717;color:white;overflow:hidden}
.video-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35}
.video-content{position:relative;z-index:1}
.works-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.work-card{background:#f7f7f5}
.work-card img{width:100%;aspect-ratio:1.35;object-fit:cover}
.work-card div{padding:16px;font-size:13px;font-weight:600}
.profile-grid{display:grid;grid-template-columns:1fr 1fr}
.profile-photo{min-height:520px;background:#222}
.profile-photo img{width:100%;height:100%;object-fit:cover}
.profile-copy{padding:75px 7vw;background:#f6f6f4}
.contact{background:#111;color:white}
.footer{background:#0a0a0a;color:white;padding:28px 4vw;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.08em}
.page-main{padding:150px 6vw 100px;min-height:75vh}
.page-inner{max-width:var(--max);margin:0 auto}
.page-heading{padding:0 0 55px;border-bottom:1px solid var(--line);margin-bottom:60px}
.page-kicker{font-size:10px;letter-spacing:.2em;text-transform:uppercase;margin:0 0 18px;color:var(--muted);font-weight:700}
.page-heading h1{font-size:76px;line-height:1;font-weight:800;letter-spacing:-.05em;margin:0}
.page-content{max-width:1100px;margin:0 auto}
.page-content img{max-width:100%;height:auto}
.photo-page .page-content{max-width:none}
.photo-page .wp-block-gallery{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px!important;margin:0!important}
.photo-page .wp-block-gallery .wp-block-image{margin:0!important;width:auto!important}
.photo-page .wp-block-gallery img{display:block;width:100%;height:360px;object-fit:cover}
.photo-page .wp-block-gallery figcaption{font-size:11px;padding:8px 0;color:var(--muted)}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1100px){.nav{gap:15px;font-size:9px}.hero{grid-template-columns:1fr}.hero-copy{padding:130px 8vw 55px}.hero-media{min-height:600px}.section-grid{grid-template-columns:1fr;gap:30px}.music{grid-template-columns:180px 180px 1fr}.works-grid{grid-template-columns:1fr 1fr}.photo-page .wp-block-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.photo-page .wp-block-gallery img{height:330px}}
@media(max-width:700px){.site-header{padding:20px}.brand{font-size:28px}.nav{gap:11px;font-size:8px;overflow:hidden}.nav a:nth-child(n+6){display:none}.hero-copy h1{font-size:64px}.hero-media{min-height:440px}.section{padding:65px 7vw}.section-title{font-size:42px}.music{grid-template-columns:1fr;gap:25px}.cover{width:100%;max-width:360px}.profile-grid{grid-template-columns:1fr}.profile-photo{min-height:420px}.news-item{grid-template-columns:82px 65px 1fr 12px;font-size:12px}.page-main{padding:120px 7vw 70px}.page-heading h1{font-size:58px}.photo-page .wp-block-gallery{grid-template-columns:1fr}.photo-page .wp-block-gallery img{height:auto;aspect-ratio:1.25;object-fit:cover}.footer{flex-direction:column;gap:10px}}

/* Kengo 1.3.0: keep the v3 navigation on the right while hiding only the small italic brand */
.site-header .brand{display:none!important;}
.site-header .nav{margin-left:auto;}

.live-list{max-width:1100px;margin:0 auto;border-top:1px solid var(--line)}
.live-card{display:grid;grid-template-columns:150px 1fr auto;gap:35px;align-items:center;padding:30px 0;border-bottom:1px solid var(--line)}
.live-date{font-family:Georgia,"Times New Roman",serif;font-size:24px;letter-spacing:-.02em}
.live-info h2{font-size:24px;margin:0 0 8px;line-height:1.3}
.live-info p{margin:4px 0;font-size:13px;color:var(--muted)}
.live-action{display:flex;gap:18px;align-items:center;font-size:11px;letter-spacing:.08em;white-space:nowrap}
.live-empty{padding:70px 0;text-align:center;color:var(--muted)}
.live-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;max-width:1100px;margin:0 auto}
.live-detail-grid img{width:100%;height:auto;display:block}
.live-detail{padding-top:5px;font-size:16px}
.live-big-date{font-family:Georgia,"Times New Roman",serif;font-size:42px;margin:0 0 25px}
@media(max-width:700px){.live-card{grid-template-columns:1fr;gap:12px}.live-date{font-size:22px}.live-info h2{font-size:20px}.live-action{justify-content:flex-start;flex-wrap:wrap}.live-detail-grid{grid-template-columns:1fr;gap:35px}.live-big-date{font-size:34px}}

/* Kengo 1.5.0: subtle lime-yellow accent */
:root{--accent:#dfff00}
.site-header .nav a{position:relative;display:inline-block;opacity:1;transition:color .2s ease}
.site-header .nav a::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:center;transition:transform .2s ease}
.site-header .nav a:hover{opacity:1;color:#111}
.site-header .nav a:hover::after{transform:scaleX(1)}
.kengo-ticker{height:38px;background:var(--accent);color:#111;overflow:hidden;display:flex;align-items:center;white-space:nowrap;font-size:11px;letter-spacing:.15em;font-weight:800}
.kengo-ticker-track{display:inline-flex;min-width:max-content;animation:kengoTicker 28s linear infinite}
.kengo-ticker-item{display:inline-block;padding-right:55px}
@keyframes kengoTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.kengo-ticker-track{animation:none}.site-header .nav a::after{transition:none}}

/* Kengo 1.8.0: VIDEO / PROFILE full-section lime-yellow color preview */
:root{--accent:#dfff00}

/* VIDEO: keep the existing content and photo, but make the section's base color lime */
.video-banner{
  background:var(--accent);
  color:#111;
}
.video-banner img{
  left:40%;
  right:0;
  width:60%;
  opacity:.95;
  object-fit:cover;
}
.video-content{
  width:40%;
  padding-right:5vw;
}
.video-content .button{
  border-color:#111;
}

/* PROFILE: keep the same two-column layout and photo; change the text panel to lime */
.profile-copy{
  background:var(--accent);
  color:#111;
}
.profile-copy .section-sub{
  opacity:.75;
}

/* Slightly stronger lime for the small hover line */
.site-header .nav a::after{background:#dfff00}

/* v1.9 VIDEO: embedded YouTube player */
.video-banner{display:grid!important;grid-template-columns:30% 70%;min-height:420px;background:#dfff00;}
.video-banner .video-content{background:#dfff00!important;color:#111!important;display:flex;flex-direction:column;justify-content:center;padding:64px 8%;position:relative;z-index:2;}
.video-banner .video-content .section-title{color:#111!important;}
.video-embed{background:#111;min-height:420px;overflow:hidden;}
.video-embed iframe{display:block;width:100%;height:100%;min-height:420px;border:0;}
@media(max-width:800px){.video-banner{grid-template-columns:1fr;}.video-embed,.video-embed iframe{min-height:240px;}}

/* Kengo 2.1.0: clickable scrolling topic ticker */
.kengo-ticker-track{display:flex;min-width:max-content;animation:kengoTicker 24s linear infinite;}
.kengo-ticker-set{display:flex;align-items:center;flex:none;}
.kengo-ticker-set a,.kengo-ticker-set span{display:inline-block;}
.kengo-ticker-set a{padding:0 9px;font-weight:800;transition:opacity .15s ease;}
.kengo-ticker-set span{padding:0 3px;}
.kengo-ticker-set a:hover{opacity:.55;}
.kengo-ticker:hover .kengo-ticker-track,.kengo-ticker:focus-within .kengo-ticker-track{animation-play-state:paused;}
@media(prefers-reduced-motion:reduce){.kengo-ticker-track{animation:none!important;transform:none!important;}}

/* Kengo 2.2.0: TOP representative achievements */
.hero-accent-line{width:240px;height:5px;background:var(--accent,#c8e600);margin:0 0 24px;}
.hero-achievements{font-size:14px;line-height:2.05;letter-spacing:.03em;max-width:420px;}
@media(max-width:700px){.hero-accent-line{width:180px;height:5px;margin-bottom:20px}.hero-achievements{font-size:13px;line-height:1.9}}

/* v2.2.7: top-right nav hover underline uses the same vivid lime-yellow, with extra thickness */
.site-header .nav a::after{height:5px;background:#dfff00;}
.site-header .nav a:hover::after{background:#dfff00;}

/* Kengo 2.3.0: VIDEO horizontal carousel with multiple YouTube videos */
.video-banner{grid-template-columns:30% 70%;align-items:stretch;padding:0;min-height:520px;}
.video-banner .video-content{width:auto;min-height:520px;padding:70px 8%;justify-content:center;}
.video-carousel{background:#111;min-height:520px;padding:46px 5vw 34px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;}
.video-stage{display:grid;grid-template-columns:54px minmax(0,1fr) 54px;align-items:center;gap:12px;max-width:1050px;width:100%;margin:0 auto;}
.video-frame-wrap{aspect-ratio:16/9;background:#000;overflow:hidden;box-shadow:0 12px 35px rgba(0,0,0,.18);}
.video-carousel-frame{display:block;width:100%;height:100%;min-height:0;border:0;}
.video-arrow{width:44px;height:44px;border:0;background:transparent;color:#fff;font-size:48px;line-height:1;cursor:pointer;padding:0;opacity:.8;transition:opacity .15s ease,transform .15s ease;}
.video-arrow:hover{opacity:1;transform:scale(1.08);}
.video-arrow:focus-visible,.video-dot:focus-visible{outline:2px solid #dfff00;outline-offset:4px;}
.video-caption{max-width:1050px;width:100%;margin:16px auto 0;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:14px;}
.video-caption strong{font-weight:700;}
.video-count{font-size:10px;letter-spacing:.12em;opacity:.6;white-space:nowrap;}
.video-dots{display:flex;justify-content:center;gap:8px;margin-top:18px;}
.video-dot{width:7px;height:7px;border:0;border-radius:50%;background:#777;padding:0;cursor:pointer;opacity:.7;}
.video-dot.is-active{background:#dfff00;opacity:1;transform:scale(1.15);}
.video-empty{color:#fff;opacity:.7;text-align:center;padding:70px 20px;}
@media(max-width:800px){
  .video-banner{grid-template-columns:1fr;}
  .video-banner .video-content{min-height:300px;padding:55px 8%;}
  .video-carousel{min-height:0;padding:30px 4vw 28px;}
  .video-stage{grid-template-columns:34px minmax(0,1fr) 34px;gap:4px;}
  .video-arrow{width:34px;height:44px;font-size:40px;}
  .video-caption{font-size:12px;}
}


/* Kengo 2.3.1: working VIDEO carousel controls */
.video-carousel[data-video-carousel] .video-arrow[disabled]{opacity:.22;cursor:default;transform:none;pointer-events:none;}
.video-carousel[data-video-carousel] .video-stage{touch-action:pan-y;}
.video-carousel-frame{transition:opacity .18s ease;}