/* index page-specific CSS (from Claude Design) */
.hero{background:linear-gradient(135deg,#1f7a36,#155026);color:var(--cream);position:relative;overflow:hidden}
.hero .dots{position:absolute;inset:0;opacity:.55}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding:80px 28px 90px}
.hero h1{font-size:clamp(2.6rem,5.4vw,4.4rem);letter-spacing:-.01em}
.hero h1 em{font-style:italic;font-weight:400;color:var(--green-bright)}
.hero p.lead{margin:22px 0 30px;font-size:1.12rem;color:rgba(246,241,231,.85);max-width:480px}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap}
.hero-art{position:relative;display:grid;place-items:center}
.hero-art img{width:min(380px,82%);filter:drop-shadow(0 30px 60px rgba(0,0,0,.4));border-radius:50%}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:-60px;position:relative;z-index:5}
.pillar{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px 26px;box-shadow:var(--shadow-lg);transition:.3s}
.pillar:hover{transform:translateY(-6px)}
.pillar .ic{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:1.5rem;margin-bottom:18px;color:#fff}
.pillar h3{font-size:1.35rem;color:var(--brown);margin-bottom:8px}
.pillar p{color:var(--muted);font-size:.92rem;margin-bottom:16px}
.howrow{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:30px}
.how{padding:26px;border-radius:16px;background:var(--cream-deep)}
.how .n{font-family:'Spectral';font-weight:900;font-size:2rem;color:var(--green)}
.how h4{color:var(--brown);margin:6px 0}
.how p{color:var(--muted);font-size:.9rem}
.mkstrip{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:34px}
.mkstrip .mc{border-radius:14px;overflow:hidden;aspect-ratio:1;position:relative;border:1px solid var(--line)}
.mkstrip .mc img{width:100%;height:100%;object-fit:cover}
.mkstrip .mc span{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(53,31,23,.82));color:#fff;font-size:.74rem;font-weight:600;padding:14px 8px 7px;text-align:center}
@media(max-width:980px){.hero .wrap{grid-template-columns:1fr;text-align:center}.hero .cta-row{justify-content:center}.hero-art{order:-1}.pillars{grid-template-columns:1fr;margin-top:30px}.howrow{grid-template-columns:1fr}.mkstrip{grid-template-columns:repeat(3,1fr)}}