/*
Theme Name: Trove Recordings V1.3
Theme URI: https://troverecordings.com
Author: Trove Recordings
Description: Editable cinematic sepia WordPress theme for Trove Recordings, Lamond, and Welcome To My World.
Version: 1.3.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: trove-v13
*/

:root{
  --black:#050505;
  --soft-black:#0d0d0d;
  --panel:#121212;
  --ivory:#f3eadc;
  --stone:#b6aa98;
  --sepia:#8b5e3c;
  --sepia-light:#c18a5b;
  --purple:#5b4375;
  --line:rgba(255,255,255,.12);
  --max:1320px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--black)}
body{
  background:
    radial-gradient(circle at 80% 10%,rgba(139,94,60,.14),transparent 28%),
    linear-gradient(180deg,#050505 0%,#0b0b0b 45%,#050505 100%);
  color:var(--ivory);
  font-family:"DM Sans",Arial,sans-serif;
  overflow-x:hidden;
}
body.admin-bar .site-header{top:32px}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}
button,input{font:inherit}
.wrap{width:min(94%,var(--max));margin:auto}
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:99;opacity:.13;
  background-image:
    radial-gradient(circle at 20% 20%,rgba(255,255,255,.3) 0 1px,transparent 1px),
    radial-gradient(circle at 80% 60%,rgba(255,255,255,.2) 0 1px,transparent 1px);
  background-size:4px 4px,5px 5px;mix-blend-mode:soft-light
}
.site-header{
  position:fixed;inset:0 0 auto;z-index:40;
  background:linear-gradient(180deg,rgba(0,0,0,.94),rgba(0,0,0,0))
}
.site-nav{
  min-height:78px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.08);gap:1rem
}
.brand{display:flex;align-items:center;gap:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.82rem}
.brand-logo{width:42px;height:42px;object-fit:contain}
.stamp{width:38px;height:38px;border:2px solid var(--ivory);display:grid;place-items:center;font-family:Anton,sans-serif;font-size:1.25rem;transform:rotate(-4deg)}
.navlinks{display:flex;gap:1.35rem;text-transform:uppercase;font-size:.7rem;letter-spacing:.12em}
.navlinks a:hover{color:var(--sepia-light)}
.mobile-menu-button{display:none;background:none;border:1px solid var(--line);color:var(--ivory);padding:.55rem .7rem}

.hero{
  min-height:100vh;padding:125px 0 60px;display:grid;align-items:end;position:relative;overflow:hidden;
  background:
    linear-gradient(90deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.72) 40%,rgba(0,0,0,.3) 70%,rgba(0,0,0,.88) 100%),
    linear-gradient(180deg,rgba(0,0,0,.1),#050505 95%)
}
.hero-media{position:absolute;right:3%;top:14%;width:min(46vw,640px);height:72%;border:1px solid var(--line);overflow:hidden;box-shadow:0 40px 120px rgba(0,0,0,.65)}
.hero-media img{width:100%;height:100%;object-fit:cover;filter:sepia(.35) contrast(1.05)}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.88))}
.hero-placeholder{width:100%;height:100%;background:radial-gradient(circle at 50% 28%,rgba(193,138,91,.25),transparent 22%),linear-gradient(145deg,#29221b,#090909)}
.hero-wordmark{position:absolute;right:5%;bottom:6%;font-family:Anton,sans-serif;font-size:clamp(4rem,9vw,8rem);color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.16);letter-spacing:.03em}
.hero-content{position:relative;z-index:3;max-width:770px}
.kicker,.eyebrow{color:var(--sepia-light);text-transform:uppercase;font-size:.72rem;letter-spacing:.21em;font-weight:700}
.hero h1{font-family:Anton,sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(4.8rem,12vw,10.5rem);line-height:.82;letter-spacing:-.03em}
.script{font-family:"Playfair Display",serif;font-style:italic;text-transform:none;color:#d8d4cd;font-size:.42em;display:block;letter-spacing:-.03em;margin:.12em 0 .25em .06em}
.hero-copy{max-width:620px;color:#c7c1b8;font-size:1.02rem;line-height:1.7;margin-top:1rem}
.dates{margin:1.8rem 0;display:flex;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.dateblock{padding:1rem 1.6rem 1rem 0;margin-right:1.6rem}
.dateblock span{display:block;color:var(--sepia-light);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}
.actions{display:flex;gap:.8rem;flex-wrap:wrap}
.btn{
  min-height:50px;padding:0 1.25rem;display:inline-flex;align-items:center;justify-content:center;
  text-transform:uppercase;font-size:.72rem;letter-spacing:.13em;border:1px solid var(--ivory);
  transition:.2s ease;font-weight:700;cursor:pointer
}
.btn.primary{background:var(--sepia);border-color:var(--sepia)}
.btn:hover{transform:translateY(-2px);background:var(--ivory);color:var(--black)}
.btn.primary:hover{background:#9f6e49;color:#fff;border-color:#9f6e49}

section{padding:100px 0;border-top:1px solid var(--line)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2.5rem}
h2{font-family:Anton,sans-serif;text-transform:uppercase;font-weight:400;font-size:clamp(3rem,7vw,6.6rem);line-height:.9}
.section-note{max-width:480px;color:var(--stone);line-height:1.7}

.release-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.release-card{border:1px solid var(--line);background:var(--panel);overflow:hidden;transition:.25s ease}
.release-card:hover{transform:translateY(-5px);border-color:rgba(193,138,91,.65)}
.release-art{aspect-ratio:1/1;background:linear-gradient(145deg,#211a15,#080808);position:relative;overflow:hidden}
.release-art.purple{background:radial-gradient(circle at 65% 25%,rgba(91,67,117,.42),transparent 28%),linear-gradient(145deg,#21182b,#080808)}
.release-art img{width:100%;height:100%;object-fit:cover}
.release-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(0,0,0,.45))}
.release-placeholder{width:100%;height:100%;display:grid;place-items:center;text-align:center;font-family:Anton,sans-serif;text-transform:uppercase;font-size:clamp(2rem,5vw,4rem);padding:1rem}
.release-body{padding:1.35rem}
.release-body h3{font-family:Anton,sans-serif;text-transform:uppercase;font-size:2rem;font-weight:400}
.release-body p{color:var(--stone);line-height:1.65;margin:.5rem 0 1rem}
.release-meta{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--sepia-light);margin-bottom:1rem}

.audio-player{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}
.audio-row{display:grid;grid-template-columns:42px 1fr auto;gap:.8rem;align-items:center}
.play-button{width:40px;height:40px;border-radius:50%;border:1px solid var(--ivory);background:transparent;color:var(--ivory);cursor:pointer}
.progress{height:4px;background:rgba(255,255,255,.15);position:relative;cursor:pointer;margin-top:.55rem}
.progress span{position:absolute;inset:0 auto 0 0;width:0;background:var(--sepia-light)}
.audio-time{font-size:.72rem;color:var(--stone)}

.album-feature,.founder-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:2rem;align-items:stretch}
.album-cover{min-height:590px;border:1px solid var(--line);background:linear-gradient(145deg,#2a2119,#090807);overflow:hidden;position:relative}
.album-cover img{width:100%;height:100%;object-fit:cover;filter:sepia(.2)}
.album-cover .fallback-title{position:absolute;left:6%;bottom:7%;font-family:Anton,sans-serif;text-transform:uppercase;font-size:clamp(3.5rem,8vw,7rem);line-height:.85}
.info-panel{background:var(--panel);border:1px solid var(--line);padding:2rem;display:flex;flex-direction:column;justify-content:center}
.info-panel h3{font-family:Anton,sans-serif;font-size:clamp(2.5rem,5vw,4rem);text-transform:uppercase;font-weight:400;line-height:.95}
.info-panel p{color:var(--stone);line-height:1.75;margin:1rem 0}
.feature-list{list-style:none;margin:1rem 0 1.5rem;border-top:1px solid var(--line)}
.feature-list li{padding:.85rem 0;border-bottom:1px solid var(--line);color:#d9d0c4}
.price{font-family:Anton,sans-serif;font-size:3rem;color:var(--sepia-light)}

.video-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:1rem}
.video-frame{border:1px solid var(--line);background:linear-gradient(145deg,#1b1b1b,#0b0b0b);position:relative;overflow:hidden;aspect-ratio:16/9}
.video-frame iframe,.video-frame video{width:100%;height:100%;border:0;object-fit:cover}
.video-placeholder{width:100%;height:100%;display:grid;place-items:center;color:var(--stone)}

.trove-statement{display:grid;grid-template-columns:.7fr 1.3fr;gap:3rem;align-items:start}
.trove-statement .statement{font-family:Anton,sans-serif;text-transform:uppercase;font-size:clamp(2.5rem,6vw,5.4rem);line-height:.95}
.trove-statement .statement span{color:var(--sepia-light)}
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:3rem}
.value{border-top:2px solid var(--ivory);padding-top:1rem}
.value h3{text-transform:uppercase;font-size:1rem;margin-bottom:.5rem}
.value p{color:var(--stone);line-height:1.65}

.community{text-align:center;background:radial-gradient(circle at 80% 20%,rgba(139,94,60,.18),transparent 24%),#0b0b0b}
.community p{max-width:650px;margin:1.25rem auto 2rem;color:var(--stone);line-height:1.7}
.fluent-form-wrap{max-width:720px;margin:auto}
.community .ff-el-form-control{min-height:54px!important;background:transparent!important;color:var(--ivory)!important;border:1px solid var(--line)!important}
.community .ff-btn-submit{min-height:52px!important;background:var(--sepia)!important;border:0!important;text-transform:uppercase!important;letter-spacing:.12em!important;font-weight:700!important}

.site-footer{padding:44px 0;border-top:1px solid var(--line)}
.footer-inner{display:flex;justify-content:space-between;gap:2rem;align-items:center}
.footer-inner small{color:var(--stone);line-height:1.6}
.social-links{display:flex;gap:1rem;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}

.reveal{opacity:0;transform:translateY(24px);transition:.75s ease}
.reveal.in{opacity:1;transform:none}

@media(max-width:900px){
  body.admin-bar .site-header{top:46px}
  .navlinks{display:none}
  .mobile-menu-button{display:block}
  .navlinks.open{display:flex;position:absolute;top:78px;left:3%;right:3%;background:#0b0b0b;border:1px solid var(--line);padding:1rem;flex-direction:column}
  .hero-media{opacity:.5;right:-24%;width:92vw}
  .hero-wordmark{font-size:5rem}
  .release-grid,.album-feature,.founder-grid,.video-grid,.trove-statement{grid-template-columns:1fr}
  .album-cover{min-height:470px}
  .values{grid-template-columns:1fr}
  .section-head,.footer-inner{align-items:flex-start;flex-direction:column}
}
@media(max-width:620px){
  .hero{padding-top:112px}
  .hero h1{font-size:4.5rem}
  .actions,.btn{width:100%}
  .dates{display:block}
  .dateblock{border-bottom:1px solid var(--line);margin:0}
  .release-grid{grid-template-columns:1fr}
  section{padding:76px 0}
}