*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--green:#2a5c2e;--green-l:#3d8b45;--dark:#111410;--gray:#6b7280;--border:#e5e7eb}
body{font-family:'Helvetica Neue',Arial,sans-serif;background:#f5f0e8;color:var(--dark);min-height:100vh;display:flex;flex-direction:column}
main{flex:1}

/* NAV */
.page-nav{background:#111410;padding:1rem 5%;display:flex;align-items:center;justify-content:space-between;gap:1rem;position:sticky;top:0;z-index:100}
.back{color:rgba(255,255,255,.7);text-decoration:none;font-size:.9rem;transition:color .2s}
.back:hover{color:#fff}
.nav-right{display:flex;align-items:center;gap:1rem}
.nav-account-link{display:flex;align-items:center;gap:.45rem;background:#6F4E37;color:#fff !important;text-decoration:none;font-size:.8rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:.4rem 1rem;border-radius:2rem;transition:background .2s;white-space:nowrap}
.nav-account-link:hover{background:#5a3d2b !important;color:#fff !important}
.nav-mini-avatar{width:26px;height:26px;border-radius:50%;background:var(--green-l);display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;color:#fff;flex-shrink:0}

/* HERO */
.hero-page{background:radial-gradient(ellipse at center,#1a5c1a 0%,#0a2d0a 50%,#030803 100%);padding:4rem 5%;text-align:center}
.hero-page h1{font-family:Georgia,serif;font-size:clamp(2rem,5vw,3rem);color:#fff;margin-bottom:.5rem}
.hero-page p{color:rgba(255,255,255,.7);font-size:1.1rem}

/* CONTENT */
.content{max-width:900px;margin:0 auto;padding:4rem 5%}

/* CARDS */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;margin:2rem 0}
.card{background:#fff;border-radius:1rem;padding:2rem;border:1px solid var(--border)}
.card-icon{font-size:2.2rem;margin-bottom:1rem}
.card h3{font-family:Georgia,serif;font-size:1.15rem;margin-bottom:.7rem;color:var(--dark)}
.card p{font-size:.9rem;color:var(--gray);line-height:1.7;margin-bottom:.4rem}
.card a{color:var(--green-l);text-decoration:none}
.card a:hover{text-decoration:underline}

/* PROSE */
.prose h2{font-family:Georgia,serif;font-size:1.3rem;color:var(--dark);margin:2rem 0 .8rem;padding-bottom:.5rem;border-bottom:2px solid var(--border)}
.prose p{color:#374151;line-height:1.8;margin-bottom:1rem;font-size:.95rem}
.prose ul{margin:.5rem 0 1rem 1.5rem;display:flex;flex-direction:column;gap:.4rem}
.prose ul li{color:#374151;font-size:.95rem;line-height:1.7}
.prose a{color:var(--green-l);text-decoration:none}
.prose a:hover{text-decoration:underline}
.prose strong{color:var(--dark)}

/* FAQ */
.faq-list{display:flex;flex-direction:column;gap:.8rem}
.faq-item{background:#fff;border-radius:.8rem;overflow:hidden;border:1px solid var(--border)}
.faq-q{width:100%;text-align:left;background:none;border:none;padding:1.2rem 1.5rem;font-size:.97rem;font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--dark);transition:background .2s}
.faq-q:hover{background:#f9f9f9}
.faq-q span{font-size:1.3rem;color:var(--green-l);flex-shrink:0;margin-left:1rem}
.faq-a{max-height:0;overflow:hidden;padding:0 1.5rem;font-size:.92rem;color:var(--gray);line-height:1.7;transition:max-height .3s ease,padding .3s}
.faq-a.open{max-height:300px;padding:0 1.5rem 1.2rem}
.faq-a a{color:var(--green-l)}

/* CONTACT FORM */
.form-group{margin-bottom:1.1rem}
label{display:block;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--gray);margin-bottom:.4rem}
input,textarea{width:100%;border:1.5px solid var(--border);border-radius:.6rem;padding:.75rem 1rem;font-size:.95rem;outline:none;transition:border-color .2s;font-family:inherit;background:#fff}
input:focus,textarea:focus{border-color:var(--green-l)}
textarea{resize:vertical}
.btn-submit{background:var(--green-l);color:#fff;border:none;padding:.9rem 2.5rem;border-radius:3rem;font-size:.95rem;font-weight:700;cursor:pointer;transition:background .2s;margin-top:.5rem}
.btn-submit:hover{background:var(--green)}

/* FOOTER */
.page-footer{position:relative;background:#000;padding:1.5rem 5%;text-align:center;overflow:hidden}
.page-footer::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#080808 0%,#1F361C 100%);opacity:.9;pointer-events:none}
.page-footer p{position:relative;z-index:1;font-size:.85rem;color:#b5b5b5}

/* RESPONSIVE */
@media(max-width:600px){
  .content{padding:2.5rem 4%}
  .hero-page{padding:3rem 4%}
  .cards{grid-template-columns:1fr}
  .faq-q{padding:1rem}
  .faq-a.open{padding:0 1rem 1rem}
}