/*
Theme Name: JustThings Exact Super Theme NL-EN
Theme URI: https://justthings.nl
Author: JustThings
Description: Exacte JustThings studio-look: zwart, warm goud, responsive ontwerp, custom SoundCloud spelers en studio hero.
Version: 4.3.0
Text Domain: justthings-exact
*/
:root{
  --black:#050505;--black2:#101010;--panel:#151515;--gold:#c38b2d;--gold2:#e0aa4b;
  --cream:#f7f3ed;--white:#fff;--muted:#b8b8b8;--line:#313131;--ink:#151515;
  --max:1320px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:#fff;font-family:Montserrat,Arial,sans-serif;line-height:1.55;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.jt-wrap{width:min(calc(100% - 44px),var(--max));margin:0 auto}

.jt-mobile-menu{display:none}

/* Header */
.jt-header{height:72px;background:#030303;border-bottom:1px solid #222;position:relative;z-index:30}
.admin-bar .jt-header{margin-top:0}
.jt-header .jt-wrap{height:100%;display:grid;grid-template-columns:190px 1fr auto;align-items:center;gap:22px}
.jt-logo img{width:155px;height:auto}
.jt-menu{display:flex;justify-content:center;align-items:center;gap:32px;font-size:12px;font-weight:700;text-transform:uppercase;white-space:nowrap}
.jt-menu a{height:72px;display:flex;align-items:center;position:relative;color:#f3f3f3;transition:.2s}
.jt-menu a:hover,.jt-menu a.is-current{color:#fff}
.jt-menu a.is-current:after,.jt-menu a:hover:after{content:"";position:absolute;bottom:12px;left:0;right:0;height:2px;background:var(--gold)}
.jt-hamburger{display:none;justify-self:end;border:0;background:transparent;color:var(--gold2);font-size:31px;line-height:1;padding:7px;cursor:pointer}

/* Hero */
.jt-hero{height:435px;background-color:#050505;position:relative;overflow:hidden}
.jt-hero:before{content:"";position:absolute;inset:0;background:url('assets/hero-guitar.jpg') right center/auto 100% no-repeat;z-index:0}
.jt-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#050505 0%,rgba(5,5,5,.98) 25%,rgba(5,5,5,.83) 39%,rgba(5,5,5,.20) 63%,rgba(5,5,5,.04) 100%);z-index:1}
.jt-hero .jt-wrap{position:relative;z-index:2;height:100%;display:flex;align-items:center}
.jt-hero-copy{width:510px;margin-left:0}
.jt-kicker{color:var(--gold2);font-size:13px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;margin-bottom:14px}
.jt-hero h1,.jt-serif{font-family:"Playfair Display",Georgia,serif}
.jt-hero h1{font-size:56px;line-height:1.08;letter-spacing:-.035em;margin:0 0 18px;color:white;font-weight:700}
.jt-rule{width:50px;height:3px;background:var(--gold);margin:0 0 18px}
.jt-hero p{margin:0 0 10px;color:#eee;font-size:15px;max-width:510px}
.jt-actions{display:flex;gap:13px;margin-top:20px;flex-wrap:wrap}
.jt-btn{min-height:43px;padding:0 26px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;text-transform:uppercase;border:1px solid var(--gold);transition:.2s}
.jt-btn--gold{background:linear-gradient(#d6a147,#ad741c);border-color:#d6a147;color:#fff}
.jt-btn--outline{background:rgba(0,0,0,.32);color:#fff}
.jt-btn:hover{transform:translateY(-1px);filter:brightness(1.09)}

/* Feature strip */
.jt-features{background:linear-gradient(180deg,#171717,#111);border-top:1px solid #292929;border-bottom:1px solid #222}
.jt-feature-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.jt-feature{min-height:151px;padding:20px 28px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid #393939}
.jt-feature:last-child{border-right:0}
.jt-feature svg{width:32px;height:32px;stroke:var(--gold2);fill:none;stroke-width:1.8;margin-bottom:11px}
.jt-feature h3{margin:0 0 10px;font-size:12px;text-transform:uppercase;font-weight:800;color:white}
.jt-feature p{max-width:280px;margin:0;color:#d2d2d2;font-size:11px;line-height:1.55}

/* Demos */
.jt-demos{background:var(--cream);color:var(--ink);padding:24px 0 34px}
.jt-section-head{text-align:center;margin:0 auto 22px}
.jt-section-head .jt-kicker{font-size:11px;margin-bottom:5px}
.jt-section-head h2{font-family:"Playfair Display",Georgia,serif;font-size:29px;line-height:1.1;margin:0 0 8px;color:#111}
.jt-section-head .jt-rule{margin:0 auto;width:34px;height:2px}
.jt-demo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.jt-demo-card{background:#fff;border:1px solid #e2ddd5;border-radius:4px;padding:9px;box-shadow:0 7px 18px rgba(0,0,0,.05)}
.jt-demo-top{display:grid;grid-template-columns:137px 1fr;gap:12px;min-height:131px}
.jt-demo-cover{width:137px;height:131px;object-fit:cover}
.jt-demo-copy h3{font-family:"Playfair Display",Georgia,serif;font-size:16px;margin:1px 0 1px;color:#111;line-height:1.1}
.jt-demo-copy .genre{font-size:11px;color:#c48422;margin-bottom:8px}
.jt-demo-copy p{font-size:11px;line-height:1.45;color:#333;margin:0}
.jt-audio{position:relative;margin-top:8px;background:#0b0b0b;border-radius:18px;height:28px;display:grid;grid-template-columns:26px 52px 1fr 25px;align-items:center;padding:0 7px;color:#fff;overflow:hidden}
.jt-audio button{border:0;background:transparent;color:#fff;width:24px;height:24px;cursor:pointer;font-size:13px;padding:0}
.jt-time{font-size:9px;color:#eee;font-variant-numeric:tabular-nums;white-space:nowrap}
.jt-track{height:4px;border-radius:3px;background:#444;position:relative;cursor:pointer;overflow:hidden}
.jt-progress{position:absolute;left:0;top:0;bottom:0;width:0;background:#b9b9b9}
.jt-volume{font-size:13px;text-align:right}
.jt-sc-frame{position:absolute!important;width:1px!important;height:1px!important;opacity:.001!important;pointer-events:none!important;left:-20px!important;top:-20px!important}
.jt-demos .jt-actions{justify-content:center;margin-top:15px}


.jt-native-audio{display:block;width:100%;margin-top:10px;height:36px;accent-color:var(--gold)}

/* Workflow */
.jt-workflow{background:#070707;color:#fff;padding:34px 0 0;position:relative;overflow:hidden}
.jt-workflow:after{content:"";position:absolute;right:0;top:0;bottom:0;width:34%;background:url('assets/hero-guitar.jpg') 76% center/cover no-repeat;opacity:.23;filter:saturate(.8)}
.jt-workflow .jt-wrap{position:relative;z-index:2}
.jt-workflow-title{margin-bottom:24px}
.jt-workflow-title h2{font-family:"Playfair Display",Georgia,serif;font-size:28px;margin:0;color:#fff}
.jt-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;padding-bottom:36px}
.jt-step{text-align:center;position:relative}
.jt-step:not(:last-child):after{content:"";position:absolute;top:29px;left:67%;right:-42%;border-top:1px dotted var(--gold)}
.jt-step-icon{width:58px;height:58px;margin:0 auto 10px;border-radius:50%;background:linear-gradient(#c89237,#9b6517);display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff;position:relative;z-index:2}
.jt-step h3{font-size:12px;margin:0 0 7px;color:#fff}
.jt-step p{font-size:10px;line-height:1.45;color:#ddd;max-width:190px;margin:0 auto}
.jt-accessbar{background:linear-gradient(90deg,#a66d1b,#ce9840);padding:11px 0}
.jt-accessbar .jt-wrap{display:grid;grid-template-columns:1fr auto;align-items:center;gap:25px}
.jt-accessbar strong{display:block;font-size:13px}.jt-accessbar span{font-size:11px;color:#fff4df}
.jt-accessbar .jt-btn{background:#111;border-color:#222;padding:0 30px}

/* Footer */
.jt-footer{background:#050505;padding:20px 0;color:#aaa;border-top:1px solid #222}
.jt-footer .jt-wrap{display:grid;grid-template-columns:180px 1fr 220px;align-items:center;gap:20px}
.jt-footer img{width:128px}
.jt-footer-nav{display:flex;justify-content:center;gap:25px;font-size:10px;text-transform:uppercase;color:#ddd;flex-wrap:wrap}
.jt-footer-right{text-align:right;font-size:10px}

/* Generic pages */
.jt-page-hero{background:linear-gradient(120deg,#070707,#18120b);padding:80px 0;color:white;border-bottom:1px solid #2c2c2c}
.jt-page-hero h1{font-family:"Playfair Display",Georgia,serif;font-size:54px;margin:0 0 10px}.jt-page-hero p{max-width:760px;color:#ddd}
.jt-page{background:#f7f3ed;color:#171717;padding:65px 0}.jt-page h2{font-family:"Playfair Display",Georgia,serif;font-size:34px}.jt-page p{max-width:850px}
.jt-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px}
.jt-form label{display:block;font-weight:700;font-size:13px;margin:14px 0 5px}.jt-form input,.jt-form select,.jt-form textarea{width:100%;padding:12px;border:1px solid #cfc9c0;background:#fff;font:inherit}.jt-form textarea{min-height:150px}.jt-form button{margin-top:15px}.jt-hp{position:absolute;left:-9999px}
.jt-msg{padding:12px 14px;background:#e6f4e8;margin-bottom:15px}.jt-msg.error{background:#f8e5e5}

/* Mobile */
@media(max-width:1050px){
 .jt-header .jt-wrap{grid-template-columns:170px 1fr auto}.jt-menu{gap:18px;font-size:10px} .jt-hero h1{font-size:48px}.jt-hero-copy{width:455px}.jt-demo-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
 .jt-wrap{width:min(calc(100% - 30px),var(--max))}
 .jt-header{height:68px;position:sticky;top:0}.jt-header .jt-wrap{display:flex;justify-content:space-between}.jt-logo img{width:145px}.jt-menu{display:none}.jt-hamburger{display:block}
 .jt-mobile-menu{display:none;position:fixed;top:68px;left:0;right:0;background:#070707;border-top:1px solid #222;z-index:100;padding:15px 24px 25px}.jt-mobile-menu.open{display:block}.jt-mobile-menu a{display:block;padding:12px 0;border-bottom:1px solid #252525;font-size:12px;text-transform:uppercase;font-weight:700}.jt-mobile-menu .jt-btn{margin-top:16px;width:100%}
 .jt-hero{height:auto;min-height:620px}.jt-hero:before{background-size:auto 58%;background-position:77% top}.jt-hero:after{background:linear-gradient(180deg,rgba(3,3,3,.05) 0%,rgba(3,3,3,.20) 36%,rgba(3,3,3,.92) 58%,#050505 72%,#050505 100%)}
 .jt-hero .jt-wrap{align-items:flex-end;padding:255px 0 38px}.jt-hero-copy{width:100%}.jt-hero h1{font-size:42px;max-width:520px}.jt-hero p{font-size:14px}.jt-actions{display:grid;grid-template-columns:1fr;max-width:330px}.jt-btn{width:100%}
 .jt-feature-grid{grid-template-columns:1fr 1fr}.jt-feature{border-right:1px solid #393939;border-bottom:1px solid #393939;min-height:170px;padding:20px 14px}.jt-feature:nth-child(2n){border-right:0}.jt-feature:nth-child(3),.jt-feature:nth-child(4){border-bottom:0}.jt-feature p{font-size:10px}
 .jt-demos{padding:28px 0}.jt-section-head h2{font-size:27px}.jt-demo-grid{grid-template-columns:1fr;gap:10px;max-width:560px;margin:0 auto}.jt-demo-card{padding:10px;background:#fff}.jt-demo-top{grid-template-columns:112px 1fr;min-height:108px}.jt-demo-cover{width:112px;height:108px}.jt-demo-copy p{font-size:10px}.jt-audio{height:31px}
 .jt-workflow{padding-top:28px}.jt-workflow:after{opacity:.13;width:70%}.jt-flow{grid-template-columns:1fr;gap:13px}.jt-step{display:grid;grid-template-columns:58px 1fr;text-align:left;column-gap:15px;align-items:center}.jt-step-icon{grid-row:1/3;margin:0}.jt-step h3,.jt-step p{max-width:none;margin:0}.jt-step:not(:last-child):after{display:none}
 .jt-accessbar .jt-wrap{grid-template-columns:1fr}.jt-footer .jt-wrap{grid-template-columns:1fr;text-align:center}.jt-footer img{margin:0 auto}.jt-footer-right{text-align:center}.jt-contact-grid{grid-template-columns:1fr}.jt-page-hero h1{font-size:42px}
}
@media(max-width:420px){.jt-hero h1{font-size:37px}.jt-feature-grid{grid-template-columns:1fr}.jt-feature{border-right:0!important;border-bottom:1px solid #393939!important}.jt-feature:last-child{border-bottom:0!important}.jt-demo-top{grid-template-columns:96px 1fr}.jt-demo-cover{width:96px;height:96px}}

/* NL / EN language switcher */
.jt-lang{display:flex;align-items:center;gap:6px;font-family:Montserrat,sans-serif;font-size:11px;font-weight:700;letter-spacing:.06em;white-space:nowrap;margin-left:auto}
.jt-lang a{color:#999;text-decoration:none;padding:7px 2px;transition:.2s ease}
.jt-lang a.active,.jt-lang a:hover{color:#d59b32}
.jt-lang span{color:#555}
.jt-mobile-lang{display:flex;gap:10px;justify-content:center;align-items:center;padding:8px 0 14px;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:6px}
.jt-mobile-lang a{display:inline-block!important;padding:7px 10px!important;color:#d59b32!important;border:0!important}
.jt-mobile-lang span{color:#666}
@media(max-width:1120px){.jt-lang{margin-left:0}}
@media(max-width:760px){.jt-lang{display:none}}