/*
Theme Name: Jouw Eigen Energie
Theme URI: https://jouw-eigen-energie.nl/
Author: Jouw Eigen Energie
Description: Lichtgewicht maatwerkthema voor Jouw Eigen Energie met responsieve homepage en energieanalyse, batterijcalculator en contractvergelijker.
Version: 1.3.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: jouw-eigen-energie
*/
:root{--navy:#123047;--green:#4fa66a;--cream:#f6f3ec;--text:#24343d;--muted:#65747c;--white:#fff;--line:#dce4e3;--shadow:0 18px 45px rgba(18,48,71,.10);--radius:24px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:#fff;line-height:1.55}a{text-decoration:none;color:inherit}.wrap{width:min(1160px,calc(100% - 36px));margin:auto}
header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(220,228,227,.8)}
.nav{height:76px;display:flex;align-items:center;justify-content:space-between}.logo{font-weight:800;font-size:21px;color:var(--navy);letter-spacing:-.5px}.logo span{color:var(--green)}nav{display:flex;gap:28px;font-size:14px;font-weight:650;color:#40535d}nav a:hover{color:var(--green)}.navcta{background:var(--navy);color:white;padding:11px 18px;border-radius:12px}
.hero{background:linear-gradient(135deg,var(--cream) 0%,#fff 68%);padding:82px 0 74px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:55px;align-items:center}.eyebrow{color:var(--green);font-weight:800;text-transform:uppercase;letter-spacing:1.4px;font-size:12px}.hero h1{font-size:clamp(42px,5vw,68px);line-height:1.03;letter-spacing:-2.8px;color:var(--navy);margin:15px 0 22px}.hero p{font-size:18px;max-width:590px;color:#53636c;margin:0 0 30px}.btn{display:inline-flex;align-items:center;gap:8px;background:var(--green);color:white;padding:14px 20px;border-radius:13px;font-weight:800;box-shadow:0 8px 22px rgba(79,166,106,.22)}.btn.secondary{background:white;color:var(--navy);border:1px solid var(--line);box-shadow:none;margin-left:8px}.trust{display:flex;gap:20px;flex-wrap:wrap;margin-top:25px;color:#607078;font-size:13px}.hero-art{background:var(--navy);border-radius:32px;min-height:400px;position:relative;padding:26px;box-shadow:var(--shadow);overflow:hidden}.sun{position:absolute;width:180px;height:180px;border-radius:50%;background:#e9c96a;right:-30px;top:-35px;opacity:.9}.house{position:absolute;left:48px;right:48px;bottom:35px;height:210px;background:#f7f5ef;border-radius:16px 16px 8px 8px}.roof{position:absolute;left:20px;right:20px;top:-105px;height:150px;background:#2e5968;transform:skewY(-23deg) rotate(-1deg);border-radius:10px}.panel-grid{position:absolute;left:88px;top:-62px;width:285px;height:112px;transform:skewY(-23deg);display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.panel-grid i{background:#315d72;border:1px solid #8db2bf;border-radius:2px}.window{position:absolute;width:74px;height:82px;background:#9dc2ca;left:46px;bottom:45px;border-radius:7px}.door{position:absolute;width:55px;height:105px;background:#7c6250;right:50px;bottom:0;border-radius:7px 7px 0 0}.battery{position:absolute;right:65px;bottom:42px;width:74px;height:115px;background:#fff;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.18)}.battery:after{content:"";position:absolute;left:14px;right:14px;top:19px;height:56px;background:linear-gradient(#4fa66a 0 25%,#e9f1eb 25%);border-radius:7px}.badge{position:absolute;left:24px;top:25px;background:white;border-radius:14px;padding:12px 15px;font-size:12px;color:var(--navy);font-weight:800;box-shadow:0 10px 25px rgba(0,0,0,.14)}

.section{padding:88px 0}.section.alt{background:var(--cream)}.center{text-align:center}.section h2{font-size:clamp(31px,4vw,46px);line-height:1.08;letter-spacing:-1.6px;color:var(--navy);margin:10px 0 14px}.lead{max-width:680px;margin:0 auto;color:var(--muted);font-size:17px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:42px}.card{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:0 8px 25px rgba(18,48,71,.045)}.stepno{font-size:12px;font-weight:900;color:var(--green);letter-spacing:1px}.card h3{color:var(--navy);font-size:22px;margin:9px 0}.card p{color:var(--muted);margin:0}.topics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}.topic{padding:24px;border-radius:20px;background:#fff;border:1px solid var(--line);min-height:160px}.topic .icon{font-size:30px}.topic h3{margin:13px 0 5px;color:var(--navy);font-size:18px}.topic p{margin:0;color:var(--muted);font-size:14px}

.calc-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:start;margin-top:42px}.calc{background:white;border:1px solid var(--line);border-radius:28px;padding:30px;box-shadow:var(--shadow)}.result{background:var(--navy);color:white;border-radius:28px;padding:30px;position:sticky;top:100px}.result h3{font-size:23px;margin:0 0 20px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{margin-bottom:2px}.field.full{grid-column:1/-1}.field label{display:block;font-weight:750;font-size:14px;color:var(--navy);margin-bottom:7px}.hint{font-size:11px;color:#7a888f;margin-top:5px}input,select{width:100%;border:1px solid #cfdad9;border-radius:12px;padding:12px 13px;font:inherit;color:var(--text);background:#fff}input:focus,select:focus{outline:3px solid rgba(79,166,106,.16);border-color:var(--green)}.range-row{display:flex;gap:12px;align-items:center}.range-row input{padding:0}.range-val{font-weight:800;color:var(--navy);min-width:70px;text-align:right}.calcbtn{width:100%;border:0;cursor:pointer;margin-top:22px;font:inherit}.result-main{font-size:42px;font-weight:900;line-height:1;color:#fff;margin:4px 0 5px}.result-sub{color:#c8d7db;font-size:13px}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}.metric{background:rgba(255,255,255,.08);padding:15px;border-radius:15px}.metric b{display:block;font-size:20px}.metric span{font-size:11px;color:#c8d7db}.note{margin-top:20px;color:#b9c9ce;font-size:11px;line-height:1.5}.score{margin-top:18px;padding:15px;border-radius:15px;background:rgba(79,166,106,.16);border:1px solid rgba(120,210,145,.25)}.score strong{color:#a9e2b8}

.compare{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:42px}.compare .card{min-height:220px}.tag{display:inline-block;background:#edf6ef;color:#34794b;border-radius:999px;padding:5px 10px;font-size:11px;font-weight:800}.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:42px}.article{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:white}.article-img{height:150px;background:linear-gradient(135deg,#dbe8e1,#edf0e9);position:relative}.article-img:before{content:"";position:absolute;left:15%;right:15%;bottom:0;height:70%;background:#fff;border-radius:70px 70px 0 0}.article-body{padding:22px}.article h3{color:var(--navy);font-size:19px;margin:5px 0 7px}.article p{color:var(--muted);font-size:14px;margin:0}.faq{max-width:820px;margin:38px auto 0}.faq details{border-bottom:1px solid var(--line);padding:19px 0}.faq summary{cursor:pointer;font-weight:800;color:var(--navy)}.faq p{color:var(--muted);margin:12px 0 0}.cta{background:var(--navy);color:white;border-radius:30px;padding:55px 60px;display:flex;align-items:center;justify-content:space-between;gap:30px}.cta h2{color:white;margin:0}.cta p{color:#cbd8dc;margin:10px 0 0}.footer{background:#0c2434;color:#b9c7cc;padding:50px 0 25px;margin-top:88px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}.footer strong{color:#fff}.footer a{display:block;margin:7px 0;font-size:14px}.small{font-size:12px;color:#83979f;margin-top:35px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)}
@media(max-width:850px){nav{display:none}.hero-grid,.calc-wrap{grid-template-columns:1fr}.hero-art{min-height:330px}.result{position:static}.steps,.topics,.compare,.article-grid{grid-template-columns:1fr 1fr}.cta{padding:40px;flex-direction:column;align-items:flex-start}}
@media(max-width:560px){.wrap{width:min(100% - 24px,1160px)}.hero{padding:58px 0}.hero h1{font-size:43px}.hero-art{min-height:285px;padding:16px}.house{left:28px;right:28px}.panel-grid{left:60px;width:220px}.battery{right:40px}.steps,.topics,.compare,.article-grid,.formgrid{grid-template-columns:1fr}.section{padding:65px 0}.calc,.result{padding:22px}.btn.secondary{margin:10px 0 0}.cta{padding:30px}}

.contract-box{max-width:1120px;margin:40px auto 0;background:#fff;border:1px solid var(--line);border-radius:26px;padding:30px;box-shadow:var(--shadow)}.contract-intro h3{margin:0;color:var(--navy);font-size:22px}.contract-intro p{margin:6px 0 20px;color:var(--muted)}.contract-profile{max-width:680px;margin-bottom:24px}.contract-table-wrap{overflow-x:auto}.contract-table{width:100%;border-collapse:collapse;min-width:920px;font-size:13px}.contract-table th{text-align:left;padding:12px 9px;color:var(--navy);background:#f7f9f7;border-bottom:1px solid var(--line)}.contract-table td{padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top}.contract-table input,.contract-table select{min-width:105px;padding:9px 8px;font-size:13px;margin:4px 0}.contract-table td:first-child input{min-width:140px}.contract-table td:first-child select{min-width:140px}.annual-result{font-weight:850;color:var(--navy);white-space:nowrap;font-size:14px}.contract-output{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:22px}.contract-output>div{background:var(--cream);border-radius:16px;padding:18px}.contract-output h3{margin:4px 0 0;color:var(--navy)}.disclaimer{font-size:12px;color:var(--muted);line-height:1.6;margin-top:20px}.contract-table tr.is-lowest{background:#edf6ef}.contract-table tr.is-current{box-shadow:inset 3px 0 var(--green)}@media(max-width:560px){.contract-box{padding:18px}.contract-output{grid-template-columns:1fr}}

/* Content pages */
.page-shell{background:linear-gradient(180deg,#f6f3ec 0,#fff 340px);padding:68px 0 20px;min-height:55vh}.content-page{max-width:860px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:28px;padding:clamp(26px,5vw,58px);box-shadow:0 14px 38px rgba(18,48,71,.055)}.page-eyebrow{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--green);font-weight:850;margin-bottom:10px}.content-page h1{font-size:clamp(36px,5vw,54px);line-height:1.07;letter-spacing:-1.8px;color:var(--navy);margin:0 0 22px}.page-content{font-size:16px;line-height:1.75;color:#40535d}.page-content p{margin:0 0 18px}.page-content h2{font-size:23px;line-height:1.2;letter-spacing:-.5px;color:var(--navy);margin:34px 0 12px}.page-content h3{color:var(--navy)}.page-content a{color:#287647;text-decoration:underline;text-underline-offset:3px}.page-lead{font-size:20px;line-height:1.55;color:#53636c;margin-bottom:30px!important}.jee-contact-form{margin-top:24px;padding:26px;background:#f8faf8;border:1px solid var(--line);border-radius:20px}.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px}.contact-fields p{margin:0 0 16px}.contact-fields label{display:block;font-size:14px;font-weight:750;color:var(--navy);margin-bottom:7px}.contact-fields input,.contact-fields textarea{font:inherit;width:100%;border:1px solid #cfdad9;border-radius:11px;padding:12px;background:#fff;color:var(--text)}.contact-fields textarea{resize:vertical}.contact-full{grid-column:1/-1}.form-privacy,.contact-direct{font-size:13px;color:var(--muted)}.contact-submit{border:0;cursor:pointer;font:inherit}.form-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.form-notice{padding:14px 18px;border-radius:12px;margin:0 0 20px;font-weight:650}.form-notice.success{background:#e9f6ec;color:#24683b}.form-notice.error{background:#fff0ee;color:#8b2f26}.legal-review-notice{background:#fff4d9;border:1px solid #e9d18c;color:#654b12;padding:16px 18px;border-radius:14px;margin:0 0 24px;font-size:14px}.legal-review-notice strong{display:block;margin-bottom:5px}@media(max-width:560px){.page-shell{padding-top:30px}.content-page{padding:24px 20px;border-radius:20px}.contact-fields{grid-template-columns:1fr}.contact-full{grid-column:auto}.jee-contact-form{padding:18px}}