/* Biofoam Alliance — unified visual system */
:root{--green:#315f4a;--green-deep:#294b3a;--sage:#eaf0e7;--cream:#fbfaf6;--ink:#293a31;--muted:#667269;--line:#dfe5dc;--white:#fffefa;--amber:#f5eee0;--warning:#fbf4e8}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--ink);background:var(--cream);font-size:16px;line-height:1.72}
.container{width:min(1120px,calc(100% - 56px));margin:0 auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(251,250,246,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:15px 0}
.header-inner{display:flex;justify-content:space-between;align-items:center;gap:24px}.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--green);font-size:19px;font-weight:650;letter-spacing:-.025em}.logo img{height:39px;width:auto;object-fit:contain}
nav ul{display:flex;align-items:center;gap:clamp(12px,2vw,27px);list-style:none;padding:0;margin:0;flex-wrap:wrap}nav a{color:#4b5a50;text-decoration:none;font-size:14px;font-weight:520;transition:color .2s}nav a:hover,nav a.active{color:var(--green)}nav a.active{box-shadow:0 2px 0 var(--green);padding-bottom:6px}
.hero{position:relative;overflow:hidden;color:var(--ink);padding:clamp(70px,9vw,112px) 0;background:linear-gradient(90deg,rgba(248,247,239,.98) 0%,rgba(248,247,239,.9) 48%,rgba(248,247,239,.2) 100%),url('hero-bg.jpg') center/cover no-repeat;border-bottom:1px solid var(--line)}.hero h1{max-width:760px;margin:0 0 18px;font-size:clamp(34px,4.3vw,56px);line-height:1.14;letter-spacing:-.04em;font-weight:630;color:#28523d}.hero p.lead{max-width:660px;margin:0;color:#4c5d51;font-size:18px;line-height:1.75}
main{padding:54px 0 78px}h1.page-title{font-size:clamp(32px,4vw,44px);line-height:1.18;letter-spacing:-.035em;color:var(--green);font-weight:630;margin:0 0 22px}h2{font-size:clamp(24px,2.6vw,31px);line-height:1.25;letter-spacing:-.025em;color:var(--green);font-weight:620;margin:48px 0 18px}h3{font-size:19px;line-height:1.35;color:var(--green);font-weight:620;margin:0 0 9px}p{margin:0 0 17px;color:#46544a;max-width:900px}
.card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:20px 0 48px}.card{background:var(--white);border:1px solid var(--line);border-radius:14px;padding:25px 27px;box-shadow:0 7px 22px rgba(45,65,49,.035);transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-2px);box-shadow:0 11px 25px rgba(45,65,49,.07)}.card p{font-size:15px;color:var(--muted);margin:0 0 13px}.card h3{margin:0 0 8px}.btn{display:inline-block;color:var(--green);text-decoration:none;font-size:14px;font-weight:620;border-bottom:1px solid #a9bcae;padding:2px 0 4px}.btn:hover{color:#1d4934;border-color:var(--green)}.btn-outline{background:transparent}
.note,.warning{padding:22px 26px;border-radius:12px;margin:26px 0 34px;background:var(--sage);border:1px solid #dce7d9;color:#43564a}.warning{background:var(--warning);border-color:#eadfc8}.note p,.warning p{margin-bottom:8px}.clean{padding-left:22px;margin:10px 0 22px}.clean li{padding-left:5px;margin:0 0 10px;color:#46544a}.breadcrumb{font-size:14px;color:#7a867d;margin:0 0 25px}.breadcrumb a{color:var(--green);text-decoration:none}.breadcrumb a:hover{text-decoration:underline}
main .container>p:not(.breadcrumb){max-width:880px}main .container>h2:first-of-type{margin-top:42px}footer{background:var(--green-deep);color:#e6ede5;padding:27px 0;font-size:14px}footer .container{display:flex;justify-content:space-between;align-items:center;gap:18px}footer a{color:#e6ede5;text-decoration:none;border-bottom:1px solid rgba(230,237,229,.45)}
@media(max-width:760px){.container{width:min(100% - 36px,620px)}.header-inner{align-items:flex-start;flex-direction:column;gap:13px}nav ul{gap:10px 17px}.hero{padding:66px 0;background-position:60% center}.hero h1{font-size:37px}.hero p.lead{font-size:16px}.card-grid{grid-template-columns:1fr;gap:13px}.card{padding:22px}main{padding:40px 0 58px}footer .container{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card{transition:none}}
