/*
Theme Name: King Richard Mix
Theme URI: https://kingrichardmix.com
Author: KRM (draft by Jax Harlan)
Description: Personal producer/engineer site for Richard Easterling (King Richard Mix). DEV draft.
Version: 0.2.6
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: kingrichardmix
*/

html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;background:#0a0a0d;color:#ececf1}
::selection{background:#c9a227;color:#000}
img{height:auto;max-width:100%}
a{color:#c9a227;text-underline-offset:.18em}
a:hover{color:#e0c25a}

.krm-header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(140%) blur(12px);background:rgba(10,10,13,.82)!important;border-bottom:1px solid rgba(255,255,255,.07)}
.krm-header .wp-block-site-title a{color:#fff!important;font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.06em;text-decoration:none}
.krm-header .wp-block-navigation{font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:.9rem}
.krm-header .wp-block-navigation a{color:#ddd!important}
.krm-header .wp-block-navigation a:hover{color:#c9a227!important}
.krm-header .wp-block-button__link{background:#c9a227!important;color:#111!important;font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.06em;padding:.55em 1.1em}

.wp-block-button__link{transition:transform .15s ease,box-shadow .2s ease}
.wp-block-button__link:hover{transform:translateY(-1px);box-shadow:0 10px 30px -10px rgba(201,162,39,.55)}
.wp-block-button.is-style-outline .wp-block-button__link{border:1.5px solid rgba(255,255,255,.4);color:#fff;background:transparent}

.krm-eyebrow{font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.22em;font-size:.82rem!important;color:#c9a227;margin-bottom:.4rem!important}
.krm-lede{font-size:clamp(1.05rem,1.4vw,1.25rem)!important;color:#a8a8b3;max-width:44rem}
.krm-muted{color:#a8a8b3}
.krm-todo{display:inline-block;font-family:Oswald,sans-serif;letter-spacing:.1em;text-transform:uppercase;font-size:.72rem;padding:.2rem .55rem;border:1px dashed #c9a227;color:#c9a227;border-radius:4px;margin:.25rem 0}

.krm-hero{min-height:min(88vh,820px)!important;align-items:flex-end!important}
.krm-hero .wp-block-cover__background{background:linear-gradient(180deg,rgba(8,8,10,.45),rgba(8,8,10,.96))!important;opacity:1!important}
.krm-hero h1{font-family:Oswald,sans-serif;font-size:clamp(2.6rem,6.5vw,5.4rem)!important;line-height:.98!important;max-width:16ch;color:#fff}
.krm-page-hero{min-height:48vh!important;align-items:flex-end!important}
.krm-page-hero h1{font-family:Oswald,sans-serif;font-size:clamp(2.2rem,5vw,4rem)!important;color:#fff}

.krm-section{padding-top:clamp(3.5rem,8vw,6.5rem)!important;padding-bottom:clamp(3.5rem,8vw,6.5rem)!important}
.krm-surface{background:#121218}
.krm-card{background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:1.6rem!important;height:100%}
.krm-card h3{font-family:Oswald,sans-serif;margin-top:0;color:#fff}
.krm-chip{display:inline-block;margin:.25rem .35rem .25rem 0;padding:.35rem .7rem;border:1px solid rgba(255,255,255,.14);border-radius:999px;font-size:.85rem;color:#ddd}
.krm-footer{border-top:1px solid rgba(255,255,255,.08);padding:2.5rem 0;color:#a8a8b3;font-size:.92rem}
.krm-footer a{color:#ddd}
.krm-devbar{background:#c9a227;color:#111;text-align:center;font-family:Oswald,sans-serif;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;padding:.35rem}

@font-face{font-family:Oswald;font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/oswald-latin.woff2) format("woff2")}
@font-face{font-family:Oswald;font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/oswald-latin.woff2) format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/inter-latin.woff2) format("woff2")}
body{font-family:Inter,system-ui,sans-serif}
h1,h2,h3,.wp-block-heading{font-family:Oswald,sans-serif;font-weight:500}
.wpcf7 input,.wpcf7 textarea,.wpcf7 select{width:100%;max-width:100%;background:#0f0f14;border:1px solid rgba(255,255,255,.15);color:#fff;padding:.7rem .85rem;border-radius:8px}
.wpcf7 label{display:block;margin:.85rem 0 .35rem;color:#ccc}
.wpcf7 input[type=submit]{background:#c9a227;color:#111;border:0;font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;width:auto;padding:.75rem 1.4rem;margin-top:1rem}

/* ---- v0.2.0: real photos, testimonials, projects ---- */
.krm-hero-portrait{min-height:min(92vh,860px)!important;align-items:center!important}
.krm-hero-portrait .wp-block-cover__background{background:linear-gradient(90deg,rgba(6,6,8,.96) 0%,rgba(6,6,8,.78) 38%,rgba(6,6,8,.15) 62%,rgba(6,6,8,0) 100%)!important}
.krm-hero-portrait .wp-block-cover__inner-container{max-width:1180px;margin:0 auto;width:100%}
.krm-hero-portrait .wp-block-cover__inner-container>*{max-width:34rem}
.krm-tagline{font-family:Oswald,sans-serif;font-size:clamp(1.25rem,2.1vw,1.7rem)!important;line-height:1.25!important;color:#fff;letter-spacing:.01em;margin:.6rem 0 .4rem!important}
.krm-page-hero .wp-block-cover__background{background:linear-gradient(180deg,rgba(8,8,10,.35),rgba(8,8,10,.92))!important;opacity:1!important}
.krm-photo img{border-radius:14px;box-shadow:0 30px 60px -30px rgba(0,0,0,.9);width:100%;object-fit:cover}
.krm-photo figcaption{color:#a8a8b3;font-size:.85rem;text-align:left}
.krm-split{align-items:center!important;gap:clamp(1.5rem,4vw,3.5rem)!important}
.krm-split-portrait{align-items:flex-start!important}
.krm-split-portrait>.wp-block-column:first-child{flex-basis:38%!important}
.krm-split-portrait>.wp-block-column:last-child{flex-basis:62%!important}
.krm-section .wp-block-columns{max-width:1180px;margin-left:auto;margin-right:auto}
.krm-gallery .krm-photo img{aspect-ratio:4/3}
.krm-gallery .krm-photo.krm-photo-wide img{aspect-ratio:16/9}
.krm-gallery+.krm-gallery{margin-top:clamp(1rem,2.5vw,1.75rem)!important}
.krm-testimonial{display:flex;flex-direction:column;gap:1rem}
.krm-testimonial .krm-avatar img{width:84px;height:84px;border-radius:50%;object-fit:cover;border:2px solid #c9a227;margin:0}
.krm-testimonial .krm-avatar{margin:0}
.krm-testimonial .wp-block-quote{border:0;margin:0;padding:0}
.krm-testimonial .wp-block-quote p{font-size:1.08rem;line-height:1.6;color:#ececf1}
.krm-testimonial cite{display:block;margin-top:.8rem;font-style:normal;color:#c9a227;font-family:Oswald,sans-serif;letter-spacing:.06em;text-transform:uppercase;font-size:.85rem}
.krm-testimonial cite strong{color:#fff;font-weight:500}
.krm-projects{list-style:none;padding:0;margin:1rem 0 1.5rem}
.krm-projects li{padding:.9rem 0;border-bottom:1px solid rgba(255,255,255,.08);color:#cfcfd8}
.krm-projects li strong{color:#fff}
.krm-chips{line-height:2.1}
@media (max-width:781px){
  .krm-hero-portrait{min-height:88vh!important;align-items:flex-end!important}
  .krm-hero-portrait .wp-block-cover__image-background{object-position:74% 20%!important}
  .krm-hero-portrait .wp-block-cover__background{background:linear-gradient(180deg,rgba(6,6,8,0) 25%,rgba(6,6,8,.82) 58%,rgba(6,6,8,.98) 100%)!important}
  .krm-split-portrait>.wp-block-column:first-child img{max-height:520px}
}

/* full-bleed heroes (post-content is constrained) */
.wp-block-post-content>.wp-block-cover.alignfull{max-width:none!important;width:100vw;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;margin-top:0!important}
.wp-block-cover.alignfull .wp-block-cover__inner-container{padding-left:clamp(1.25rem,4vw,2.5rem);padding-right:clamp(1.25rem,4vw,2.5rem)}
.krm-header>.wp-block-group{padding-left:clamp(1rem,4vw,2rem)!important;padding-right:clamp(1rem,4vw,2rem)!important}
body{overflow-x:hidden}
/* full-bleed section bands; inner content stays constrained, columns go wide */
.wp-block-post-content>.krm-section{max-width:none!important;width:100vw;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;margin-top:0!important;margin-bottom:0!important;padding-left:clamp(1.25rem,4vw,2.5rem)!important;padding-right:clamp(1.25rem,4vw,2.5rem)!important}
.krm-section>*{max-width:1100px!important;margin-left:auto!important;margin-right:auto!important}
.krm-section>p,.krm-section>.wp-block-heading{max-width:1100px!important}
.wp-block-post-content{margin-top:0!important}
main.wp-block-group{margin-top:0!important;padding-top:0!important}
/* stop header wrap before webfonts load (CLS) */
@media (min-width:782px){.krm-header>.wp-block-group{flex-wrap:nowrap!important}.krm-header .wp-block-navigation{flex-shrink:1;min-width:0}}
/* About hero v3: Richard at the console, The Platinum Underground (picture element; 16:7 desktop, near-square mobile crop).
   Desktop: Richard sits right of centre, so the overlay is darker on the left (title side) and lighter over him and the console. */
.krm-about-hero .wp-block-cover__image-background{object-position:50% 23%!important}
/* v4 (0.2.3): About + Listen heroes zoomed out to near full-frame; band raised on desktop (About 66vh, Listen 60vh) (these two pages only) so more of the board/desk shows */
@media (min-width:782px){.krm-page-hero.krm-about-hero{min-height:66vh!important}.krm-page-hero.krm-listen-hero{min-height:60vh!important}}
@media (min-width:782px){.krm-page-hero.krm-about-hero .wp-block-cover__background{background:linear-gradient(90deg,rgba(6,6,8,.82) 0%,rgba(6,6,8,.55) 30%,rgba(6,6,8,.12) 58%,rgba(6,6,8,0) 100%),linear-gradient(180deg,rgba(8,8,10,.12) 35%,rgba(8,8,10,.78) 100%)!important;opacity:1!important}}
@media (max-width:781px){.krm-about-hero .wp-block-cover__image-background{object-position:50% 50%!important}}
/* Contact + Listen heroes v3 (picture element via krmmix_hero_sets) */
.krm-contact-hero .wp-block-cover__image-background,.krm-listen-hero .wp-block-cover__image-background{object-position:50% 50%!important}
@media (min-width:782px){.krm-listen-hero .wp-block-cover__image-background{object-position:50% 40%!important}}
/* Listen: Stream section (v0.2.5, 2026-10-05). Releases + service links from bio.to/kingrichard. */
.krm-stream{padding-bottom:clamp(2.5rem,5vw,3.5rem)!important}
.krm-listen-more{padding-top:clamp(2.5rem,5vw,3.5rem)!important;border-top:1px solid rgba(255,255,255,.07)}
.krm-stream .krm-lede{margin-top:.5rem!important}
.krm-section .wp-block-columns.krm-releases{gap:1.25rem!important;margin-top:1.75rem!important;max-width:1100px}
.krm-release{display:grid!important;grid-template-columns:96px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:1rem;align-content:start}
.krm-release>*{margin:0!important}
.krm-release>.krm-release-art{grid-row:1/3;grid-column:1}
.krm-release-art img{width:96px;height:96px;object-fit:cover;border-radius:8px;display:block;box-shadow:0 8px 24px -12px rgba(0,0,0,.8)}
.krm-release>h3{grid-column:2;align-self:end;font-size:1.3rem;line-height:1.2}
.krm-release>.krm-release-artist{grid-column:2;align-self:start;color:#a8a8b3;font-size:.95rem;margin-top:.2rem!important}
.krm-release>.krm-svc{grid-column:1/-1;align-self:end;margin-top:1.15rem!important;gap:.5rem!important}
.krm-svc .wp-block-button__link{font-size:.82rem!important;padding:.42em .9em!important;border-width:1px!important}
.krm-svc .wp-block-button.is-style-outline .wp-block-button__link:hover{border-color:#c9a227;color:#fff}
.krm-all-links{margin-top:2rem!important}
.krm-btn-gold .wp-block-button__link{background:#c9a227!important;color:#111!important;font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:1rem;padding:.8em 1.8em!important}
@media (max-width:781px){.krm-section .wp-block-columns.krm-releases{gap:1rem!important}.krm-release{grid-template-columns:80px minmax(0,1fr)}.krm-release-art img{width:80px;height:80px}.krm-btn-gold,.krm-btn-gold .wp-block-button__link{width:100%;text-align:center}}
