/* JOE Green: supplied photographic brand identity, September 2026. */
:root{--forest:#073D2B;--green:#4F8B4F;--lime:#A7C957;--paper:#F5F7F2;--line:#d8e1d6}
.header{background:#041d13;color:var(--paper);border-bottom:1px solid #31523a}
.header-inner{min-height:112px}
.brand,.brand img{width:186px}
.brand img{border-radius:2px}
.brand.wordmark{width:186px;display:flex;flex-direction:column;align-items:flex-start;line-height:.85;padding:12px 0}
.brand.wordmark span{margin:0;text-align:left;font-family:Arial,Helvetica,sans-serif;font-weight:900}
.brand.wordmark .wordmark-joe{font-size:58px;letter-spacing:-.045em;color:#fff}
.brand.wordmark .wordmark-green{font-size:28px;letter-spacing:.12em;color:var(--lime);margin-top:7px}
nav{font-size:14px}
nav .button{background:var(--lime);color:#082719;font-weight:700}
nav .button:hover{background:#c0dc82}
.menu-toggle{color:var(--paper);border-color:#74926b}
.hero{width:100%;margin:0;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:48px;padding:70px max(48px,calc((100vw - 1280px)/2)) 76px;background:#041d13;color:white;align-items:center}
.hero .eyebrow{color:var(--lime)}
.hero .eyebrow:before{background:var(--lime)}
.hero h1{font-weight:650;font-size:clamp(44px,4.5vw,64px);letter-spacing:-.045em;line-height:1.08}
.hero h1 em{color:var(--lime)}
.hero .lead{color:#d7e3d0;font-size:17px}
.hero .button{background:var(--lime);color:#082719;font-weight:700}
.hero .button:hover{background:#c0dc82}
.hero .text-link{color:white}
.hero-panel{padding:0;min-height:0;background:transparent;border:1px solid #335139;overflow:hidden;border-radius:8px;display:block;box-shadow:0 20px 60px #0004}
.hero-brand{width:100%;height:auto}
.panel-bottom{padding:22px 25px;margin:0;border-color:#335139;align-items:center;display:flex;gap:15px}
.panel-bottom span{font-size:11px;letter-spacing:.12em;color:#d6e7c3;margin:0}
.panel-bottom span:nth-child(2){color:var(--lime);font-size:22px}
.strip{background:#edf2e7}
.section h2{font-weight:600;letter-spacing:-.045em}
.feedstock-grid{border:0;gap:18px}
.feedstock-grid article{border:1px solid #d7e1cc;border-top:3px solid var(--lime);background:white;border-radius:5px;padding:30px}
.feedstock-grid h3{font-weight:600}
.feedstock-grid .index{color:#3f6637}
.dark{background:#06291b}
.soft{background:#eaf0e3}
.criteria li{border-color:#436245}
.sourcing{border-color:#cad9bc;background:#edf3e7;border-radius:5px}
.founder-banner{width:100%;height:auto;margin-bottom:60px;border-radius:8px;box-shadow:0 16px 40px #16381d1a}
.contact-card{background:#06291b;color:var(--paper);border-radius:6px;overflow:hidden;grid-template-columns:1fr}
.portrait{min-height:0;height:340px;object-position:center 30%}
.contact-details{padding:30px;width:100%}
.contact-details .eyebrow{font-size:12px;color:var(--lime)}
.contact-details h3{font-size:30px;color:white}
.contact-details h3 br{display:initial}
.contact-details .eyebrow:before{background:var(--lime)}
.contact-details p,.contact-details address,.contact-details address a{font-size:15px}
.contact-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px;width:100%}
.contact-option{display:flex;gap:18px;justify-content:space-between;align-items:center;padding:13px 15px;border:1px solid #6a8559;border-radius:3px;color:var(--paper);font-size:14px!important;line-height:1.4;min-height:48px;text-decoration:none!important}
.contact-option:hover{background:#284f30;border-color:var(--lime)}
.contact-option.whatsapp{background:var(--lime);border-color:var(--lime);color:#072a1a;font-weight:700}
.contact-option.whatsapp:hover{background:#bddc7c}
.contact-option.linkedin{color:var(--paper);font-weight:600}
.contact-end{align-items:start}
.contact-end .actions{min-width:350px;max-width:440px;flex:1}
.contact-end .contact-options{margin-top:14px}
.contact-end .actions>a:not(.button){color:var(--paper)}
.closing-brand{border-color:#436245}
.closing-brand img{width:210px;border-radius:3px}
.closing-brand>span{font-size:22px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
a:focus-visible,button:focus-visible{outline:3px solid var(--lime);outline-offset:4px}
.section:not(.dark) a:focus-visible{outline-color:#35652d}
@media(max-width:1150px){.hero{padding:55px 28px 60px;gap:30px}.brand,.brand img{width:172px}.contact-end .actions{min-width:320px}.contact-option{padding:12px}.contact-options{gap:8px}.feedstock-grid article{padding:24px}.closing-brand>span{font-size:18px}}
@media(max-width:900px){.header-inner{min-height:96px}.brand,.brand img{width:158px}.hero{grid-template-columns:1fr;gap:34px}.hero-copy{max-width:680px}.hero h1{font-size:60px}.hero-panel{max-width:680px}.hero-brand{max-height:370px;object-fit:contain;background:#001609}.contact-card{grid-template-columns:1fr 1fr}.portrait{height:100%;min-height:430px}.contact-options{grid-template-columns:1fr}.contact-end .actions{min-width:290px}.contact-end .contact-options{grid-template-columns:1fr}.contact-details h3{font-size:27px}.founder-banner{margin-bottom:42px}}
@media(max-width:600px){html{scroll-padding-top:105px}.header-inner{min-height:86px}.brand,.brand img{width:142px}.hero{padding:36px 20px 40px;gap:30px}.hero h1{font-size:clamp(40px,10vw,56px)}.hero .lead{font-size:16px}.hero .actions{gap:12px}.hero-panel{display:block}.hero-brand{height:auto;max-height:none}.panel-bottom{padding:15px 14px;gap:10px}.panel-bottom span{font-size:9px;letter-spacing:.08em}.panel-bottom span:nth-child(2){font-size:18px}.feedstock-grid{gap:12px}.feedstock-grid article{padding:22px 16px}.founder-banner{display:none}.contact-card{grid-template-columns:1fr}.portrait{height:360px;min-height:0}.contact-details{padding:26px}.contact-options{grid-template-columns:1fr 1fr}.contact-end .actions{min-width:0;max-width:none}.contact-end .contact-options{grid-template-columns:1fr 1fr}.contact-option{font-size:13px!important;padding:12px 10px;gap:9px}.closing-brand{flex-direction:row;align-items:center;gap:24px}.closing-brand img{width:150px}.closing-brand>span{font-size:15px;letter-spacing:.08em;max-width:130px}.section h2{font-size:34px}}
@media(max-width:380px){.contact-options,.contact-end .contact-options{grid-template-columns:1fr}.feedstock-grid{grid-template-columns:1fr}.closing-brand{flex-direction:column;align-items:start}.closing-brand>span{max-width:none}.panel-bottom span{font-size:8px}}
