/*
Theme Name: Kiff Modern
Theme URI: https://www.kiffworlds.com/
Author: Krystal Image Filmworks
Description: Block theme for Krystal Image Filmworks. Cinematic letterbox framing, dark ink palette, broadcast-red accent.
Version: 2.5.0
Requires at least: 6.4
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: kiff-modern
*/
html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased}
a{text-underline-offset:.2em}
:where(a,button,input,textarea):focus-visible{outline:3px solid var(--wp--preset--color--tally);outline-offset:3px}
.wp-block-heading,.wp-block-site-title,.wp-block-post-title{text-wrap:balance}
p{max-width:64ch}
.has-text-align-center p,.kiff-cta p{margin-inline:auto}

/* header */
.kiff-header{position:sticky;top:0;z-index:50;background:rgba(14,26,28,.96);border-bottom:1px solid var(--wp--preset--color--line);padding:.9rem clamp(1rem,4vw,2.5rem)}
.kiff-header .wp-block-site-title a{text-decoration:none;font-family:var(--wp--preset--font-family--display);font-size:1.25rem;font-weight:700;color:var(--wp--preset--color--bone)}
.kiff-header .wp-block-navigation a{text-decoration:none}
.kiff-header .wp-block-navigation a:hover{color:var(--wp--preset--color--tally)}

/* sections */
.kiff-s{padding:clamp(3.5rem,8vw,6.5rem) clamp(1.25rem,4vw,2.5rem)}
.kiff-panel{background:var(--wp--preset--color--panel)}
.kiff-s>*{max-width:1180px}
.kiff-hero{padding-top:clamp(3rem,7vw,5.5rem)}
.kiff-hero h1{font-size:clamp(2.6rem,7.2vw,5.6rem);line-height:1.02;letter-spacing:-.025em;max-width:15ch;margin-block:.6rem 1.2rem}
.kiff-hero .kiff-lead{font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--wp--preset--color--mist);max-width:56ch}
.kiff-onair{display:flex;align-items:center;gap:.6rem;color:var(--wp--preset--color--mist);font-size:.95rem;margin:0}
.kiff-onair::before{content:"";width:.7rem;height:.7rem;border-radius:50%;background:var(--wp--preset--color--tally);animation:kiff-tally 2.4s ease-in-out 3}
@keyframes kiff-tally{0%,100%{box-shadow:0 0 0 0 rgba(242,85,58,.55)}50%{box-shadow:0 0 0 .6rem rgba(242,85,58,0)}}
@media (prefers-reduced-motion:reduce){.kiff-onair::before{animation:none}html{scroll-behavior:auto}}

/* the one signature: cinematic letterbox */
.kiff-frame{background:#000;padding-block:clamp(.4rem,1.6vw,1.3rem);margin-block:2rem 0}
.kiff-frame img{display:block;width:100%;aspect-ratio:2.39/1;object-fit:cover}
.kiff-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:.75rem}
.kiff-grid>*{margin:0!important;max-width:none!important}
.kiff-grid .wp-block-image img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}

/* rows, stats, quotes */
.kiff-row{gap:clamp(1.5rem,4vw,4rem);align-items:center;margin-block:clamp(2rem,5vw,4rem)!important}
.kiff-row img{width:100%;height:auto;display:block}
@media(min-width:782px){.kiff-reverse{flex-direction:row-reverse}}
.kiff-stats{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;border-top:1px solid var(--wp--preset--color--line);padding-top:2rem}
.kiff-stats>*{margin:0!important}
.kiff-stats .n{font-family:var(--wp--preset--font-family--display);font-size:clamp(2rem,4vw,3rem);line-height:1;margin:0 0 .4rem}
.kiff-stats .l{color:var(--wp--preset--color--mist);margin:0}
.kiff-cols3{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1.25rem}
.kiff-cols3>*{margin:0!important;max-width:none!important}
.kiff-card{background:var(--wp--preset--color--panel);border-left:3px solid var(--wp--preset--color--tally);padding:1.5rem}
.kiff-card h3{margin-top:0}
.kiff-quote .stars{color:var(--wp--preset--color--tally);letter-spacing:.15em;margin:0 0 .75rem}
.kiff-quote .who{font-weight:600;margin:1rem 0 0}
.kiff-list{padding-left:1.1rem;color:var(--wp--preset--color--mist)}
.kiff-list li{margin-block:.35rem}
.kiff-cta{text-align:center}
.kiff-cta .wp-block-buttons{justify-content:center}
.kiff-meta{color:var(--wp--preset--color--mist);font-size:.95rem}

/* form */
.kiff-form{display:grid;gap:1rem;max-width:640px}
.kiff-form .two{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:600px){.kiff-form .two{grid-template-columns:1fr}}
.kiff-form label{display:grid;gap:.35rem;font-weight:600}
.kiff-form input,.kiff-form textarea{font:inherit;color:inherit;background:var(--wp--preset--color--panel);border:1px solid var(--wp--preset--color--line);padding:.8rem 1rem;border-radius:2px;width:100%;box-sizing:border-box}
.kiff-form .hp{position:absolute;left:-9999px}
.kiff-form button{font:inherit;font-weight:700;background:var(--wp--preset--color--tally);color:var(--wp--preset--color--ink);border:0;padding:.9rem 1.8rem;cursor:pointer;justify-self:start;border-radius:2px}
.kiff-note{padding:1rem;border-left:3px solid var(--wp--preset--color--tally);background:var(--wp--preset--color--panel)}

/* footer */
.kiff-footer{border-top:1px solid var(--wp--preset--color--line);padding:3rem clamp(1.25rem,4vw,2.5rem) 2rem;background:var(--wp--preset--color--ink)}
.kiff-footer a{text-decoration:none}.kiff-footer a:hover{color:var(--wp--preset--color--tally)}
.kiff-footer ul{list-style:none;padding:0;margin:0}.kiff-footer li{margin-block:.4rem}

/* ===== v2: agency-style home ===== */
.wp-block-heading,.wp-block-site-title,.wp-block-post-title{text-transform:uppercase}
.kiff-card h3,.kiff-step h3,.kiff-footer h3{text-transform:none}
:target,[id]{scroll-margin-top:5.5rem}
.kiff-header .wp-block-site-title a{font-family:var(--wp--preset--font-family--body);font-weight:800;text-transform:uppercase;letter-spacing:.02em;font-size:1.05rem}
.kiff-header .kiff-nav-cta a{background:var(--wp--preset--color--tally);color:var(--wp--preset--color--ink)!important;padding:.55rem 1.1rem;border-radius:2px;font-weight:700}
.kiff-header .kiff-nav-cta a:hover{background:var(--wp--preset--color--bone)}
.kiff-hero h1{font-size:clamp(2.2rem,5.5vw,4.4rem);max-width:20ch}

.kiff-hero2{position:relative;display:flex;align-items:flex-end;min-height:min(88vh,820px);overflow:hidden;padding:clamp(7rem,16vw,11rem) clamp(1.25rem,4vw,2.5rem) clamp(3rem,6vw,5rem)}
.kiff-hero2::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(14,26,28,.55) 0%,rgba(14,26,28,.9) 100%)}
.kiff-slides{position:absolute!important;inset:0;margin:0!important;max-width:none!important}
.kiff-slides figure{position:absolute;inset:0;margin:0!important;max-width:none!important;opacity:0;animation:kiff-fade 24s infinite}
.kiff-slides figure:nth-child(1){animation-delay:0s}.kiff-slides figure:nth-child(2){animation-delay:6s}
.kiff-slides figure:nth-child(3){animation-delay:12s}.kiff-slides figure:nth-child(4){animation-delay:18s}
.kiff-slides img{width:100%;height:100%;object-fit:cover;display:block}
@keyframes kiff-fade{0%{opacity:0}4%{opacity:1}25%{opacity:1}30%{opacity:0}100%{opacity:0}}
.kiff-hero2 .kiff-hero2-inner{position:relative;z-index:2;width:100%;max-width:1180px;margin-inline:auto}
.kiff-hero2 h1{font-size:clamp(2.4rem,6.4vw,5.2rem);line-height:1.02;max-width:17ch;margin-block:.8rem 1.2rem}
.kiff-hero2 .kiff-lead{font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--wp--preset--color--bone);max-width:56ch}
@media (prefers-reduced-motion:reduce){.kiff-slides figure{animation:none}.kiff-slides figure:nth-child(1){opacity:1}}

.kiff-marquee-wrap{overflow:hidden;border-block:1px solid var(--wp--preset--color--line);padding:1.1rem 0;background:var(--wp--preset--color--ink)}
.kiff-marquee{display:flex;width:max-content;max-width:none!important;margin:0!important;font-weight:700;text-transform:uppercase;letter-spacing:.04em;animation:kiff-scroll 45s linear infinite}
.kiff-marquee span{padding-right:2.5rem;display:inline-flex;align-items:center;gap:2.5rem;white-space:nowrap}
.kiff-marquee span::after{content:"";width:.5rem;height:.5rem;background:var(--wp--preset--color--tally)}
@keyframes kiff-scroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.kiff-marquee{animation:none;flex-wrap:wrap;width:auto}}

.kiff-cols4{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))!important}
.kiff-s .kiff-stats{margin-bottom:2.5rem}
.kiff-step{border-top:2px solid var(--wp--preset--color--tally);padding-top:1rem}
.kiff-stepn{font-weight:800;font-size:1.1rem;color:var(--wp--preset--color--tally);margin:0 0 .5rem}
.kiff-faq details{border-bottom:1px solid var(--wp--preset--color--line);padding:1.1rem 0;max-width:820px}
.kiff-faq summary{cursor:pointer;font-weight:700;list-style-position:outside}
.kiff-faq details p{color:var(--wp--preset--color--mist);margin:.8rem 0 0}
.kiff-wa{font-weight:700;font-size:.95rem;text-decoration:none;position:fixed;right:1.1rem;bottom:1.1rem;z-index:60;padding:.8rem 1.1rem;border-radius:2rem;background:#25D366;color:#0b2a1a;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.kiff-wa:hover{color:#0b2a1a;transform:scale(1.06)}

/* ===== v2.1: light scheme; hero stays dark over photos ===== */
.kiff-hero2,.kiff-hero2 h1,.kiff-hero2 .kiff-lead,.kiff-hero2 .kiff-onair{color:#fff}
.kiff-hero2 .kiff-onair{color:#dce6e4}
.kiff-hero2 .kiff-lead{color:#eef3f2}
.kiff-hero2 .is-style-outline .wp-block-button__link{color:#fff;border-color:#fff;background:transparent}
.kiff-hero2 .is-style-outline .wp-block-button__link:hover{background:#fff;color:#10201F}
.kiff-card{box-shadow:0 1px 0 var(--wp--preset--color--line)}

/* ===== v2.2: mobile menu ===== */
/* no backdrop-filter on the header: it would trap the fixed full-screen menu inside the header bar */
.kiff-header{backdrop-filter:none;-webkit-backdrop-filter:none;padding-top:max(.9rem,env(safe-area-inset-top))}
.kiff-header .wp-block-navigation__submenu-container{background:var(--wp--preset--color--ink);border:1px solid var(--wp--preset--color--line);padding:.5rem;min-width:260px}
.kiff-header .wp-block-navigation__submenu-container a{padding:.5rem .75rem}
.kiff-call{display:none}
.wp-block-navigation__responsive-container-open,.wp-block-navigation__responsive-container-close{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;color:var(--wp--preset--color--bone)}
.wp-block-navigation__responsive-container-open svg,.wp-block-navigation__responsive-container-close svg{width:30px;height:30px}
@media(max-width:900px){.kiff-header .wp-block-navigation{font-size:.92rem}}
@media(max-width:599px){
	.kiff-header{padding:.55rem 1rem;padding-top:max(.55rem,env(safe-area-inset-top))}
	.kiff-header .wp-block-site-title a{font-size:.9rem;line-height:1.2}
	.kiff-header .wp-block-site-title{max-width:11rem}
	.kiff-call{display:inline-flex;align-items:center;min-height:44px;margin-left:auto;margin-right:.25rem;padding:0 .9rem;font-weight:700;text-decoration:none;border:1px solid var(--wp--preset--color--line);border-radius:2px}
	.wp-block-navigation__responsive-container.is-menu-open{background:var(--wp--preset--color--ink);color:var(--wp--preset--color--bone);padding:1rem 1.25rem 2rem;padding-top:max(1rem,env(safe-area-inset-top))}
	.is-menu-open .wp-block-navigation__responsive-container-content{padding-top:3.5rem;align-items:stretch;gap:0}
	.is-menu-open .wp-block-navigation__container{width:100%;align-items:stretch!important;gap:0}
	.is-menu-open .wp-block-navigation-item{width:100%;display:block;font-size:1.45rem;font-weight:700;border-bottom:1px solid var(--wp--preset--color--line)}
	.is-menu-open .wp-block-navigation-item__content{display:block;padding:.95rem 0}
	.is-menu-open .wp-block-navigation__submenu-container{padding:0 0 .6rem 1rem!important;border:0!important;background:transparent!important;min-width:0;width:100%}
	.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item{font-size:1.05rem;font-weight:500;border:0}
	.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content{padding:.55rem 0;color:var(--wp--preset--color--mist)}
	.is-menu-open .kiff-nav-cta{border:0;margin-top:1.25rem}
	.is-menu-open .kiff-nav-cta .wp-block-navigation-item__content{background:var(--wp--preset--color--tally);color:var(--wp--preset--color--ink)!important;text-align:center;padding:1rem;border-radius:2px;font-size:1.1rem}
	.kiff-hero2{min-height:82svh}
	.kiff-hero2 .wp-block-buttons{flex-direction:column;align-items:stretch}
	.kiff-hero2 .wp-block-button__link{display:block;text-align:center}
	.kiff-wa{bottom:max(.9rem,env(safe-area-inset-bottom))}
}

/* ===== v2.2.1: hamburger on the left (phones) ===== */
@media(max-width:599px){
	.kiff-header{flex-wrap:nowrap!important;justify-content:flex-start!important;gap:.5rem}
	.kiff-header>.wp-block-navigation{order:-1;margin:0 .25rem 0 -.6rem;flex:0 0 auto}
	.kiff-header .wp-block-site-title{order:0}
	.kiff-call{order:1}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close{right:auto;left:.6rem;top:max(.55rem,env(safe-area-inset-top))}
	.is-menu-open .wp-block-navigation__responsive-container-content{text-align:left}
}

/* ===== v2.3: centred desktop menu ===== */
.kiff-header-cta{display:none}
.kiff-header .wp-block-navigation__container{gap:clamp(1rem,2.2vw,2.25rem)}
.kiff-header .wp-block-navigation-item__content{position:relative;font-weight:600;letter-spacing:.01em;padding-block:.4rem}
.kiff-header .wp-block-navigation > .wp-block-navigation__container > .wp-block-navigation-item:not(.kiff-nav-cta) > .wp-block-navigation-item__content::after{content:"";position:absolute;left:0;right:0;bottom:-.1rem;height:2px;background:var(--wp--preset--color--tally);transform:scaleX(0);transform-origin:center;transition:transform .25s ease}
.kiff-header .wp-block-navigation-item:not(.kiff-nav-cta) > .wp-block-navigation-item__content:hover::after,
.kiff-header .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content::after,
.kiff-header .wp-block-navigation-item__content[aria-current="page"]::after{transform:scaleX(1)}
.kiff-header .wp-block-navigation__submenu-container{border-radius:6px;box-shadow:0 12px 32px rgba(16,32,31,.14);padding:.6rem;margin-top:.6rem}
.kiff-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content{padding:.55rem .8rem;border-radius:4px;font-weight:500}
.kiff-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after{display:none}
.kiff-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover{background:var(--wp--preset--color--panel)}
@media(min-width:600px){
	.kiff-header{display:grid!important;grid-template-columns:auto 1fr;align-items:center;column-gap:1.5rem}
	.kiff-header>.wp-block-site-title{grid-column:1}
	.kiff-header>.wp-block-navigation{grid-column:2;justify-self:end}
}
@media(min-width:900px){
	.kiff-header{grid-template-columns:1fr auto 1fr}
	.kiff-header>.wp-block-navigation{justify-self:center}
	.kiff-header>.kiff-header-cta{display:inline-flex;grid-column:3;justify-self:end;align-items:center;background:var(--wp--preset--color--tally);color:var(--wp--preset--color--ink);font-weight:700;text-decoration:none;padding:.65rem 1.3rem;border-radius:2px;transition:background .2s}
	.kiff-header>.kiff-header-cta:hover{background:var(--wp--preset--color--bone);color:var(--wp--preset--color--ink)}
	.kiff-header .kiff-nav-cta{display:none}
}
@media(prefers-reduced-motion:reduce){.kiff-header .wp-block-navigation-item__content::after{transition:none}}

/* ===== v2.4: page heroes ===== */
.kiff-hero2{background:#10201F}
.kiff-hero2.kiff-hero2--page{min-height:clamp(300px,46vh,460px);padding-top:clamp(4.5rem,9vw,7rem);padding-bottom:clamp(2.25rem,5vw,3.75rem)}
.kiff-hero2--page h1{font-size:clamp(2.1rem,5vw,3.9rem);max-width:20ch}
.kiff-hero2--page .kiff-slides figure{opacity:1;animation:none}
.kiff-hero2--page .kiff-meta{color:#dce6e4}
.kiff-hero2--page .kiff-lead{max-width:60ch}
@media(max-width:599px){.kiff-hero2.kiff-hero2--page{min-height:300px}}

/* ===== v2.5: back to dark ===== */
.kiff-header .wp-block-navigation__submenu-container{box-shadow:0 14px 34px rgba(0,0,0,.45)}
.kiff-hero2 .is-style-outline .wp-block-button__link:hover{color:#0E1A1C}
