.planner-page .site-header { background:#fff; color:#16231c; border-bottom:1px solid #d6dfd9; }
.planner-page .language-switch { color:#142a1e; background:#fff; border:1px solid #173c2a; }
.planner-page .language-switch a { color:#142a1e; }
.planner-hero { background:#102b20; color:#fff; padding:160px 0 76px; }
.planner-hero-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:60px; align-items:center; }
.planner-hero h1 { font-size:clamp(40px,4.5vw,70px); line-height:1.05; margin:22px 0; letter-spacing:-.035em; }
.planner-hero h1 em { color:#9fe8ba; font-style:normal; }
.planner-hero .eyebrow { color:#a4eec1; }
.planner-lead { font-size:19px; line-height:1.6; color:#d3e2d9; max-width:650px; }
.planner-entry { display:flex; gap:24px; align-items:center; flex-wrap:wrap; margin:30px 0 14px; }
.planner-entry p { margin:0; color:#d8e7de; font-size:14px; }
.planner-code { font:700 25px/1.4 monospace; letter-spacing:.13em; display:block; color:#fff; }
.planner-caption { font-size:13px; color:#c1d7ca; }
.planner-diagram { margin:0; padding:25px; border:1px solid #527562; background:linear-gradient(140deg,#214b38,#132e22); border-radius:16px; box-shadow:0 30px 65px #0003; }
.planner-diagram figcaption { font-size:14px; color:#d7eddf; display:flex; gap:10px; align-items:center; }
.planner-dot { width:8px; height:8px; border-radius:50%; background:#9be7ba; flex-shrink:0; }
.planner-diagram-head { display:flex; justify-content:space-between; gap:14px; padding:28px 0 20px; border-bottom:1px solid #496b59; font-size:11px; }
.planner-diagram-head strong { letter-spacing:.1em; }
.planner-diagram-head span { color:#bed6c8; text-align:right; }
.planner-lanes { list-style:none; padding:10px 0; margin:0; }
.planner-lanes li { display:grid; grid-template-columns:90px 1fr; align-items:center; min-height:64px; gap:12px; border-bottom:1px solid #ffffff10; font-size:12px; }
.planner-lanes b { display:block; width:85%; border-radius:6px; padding:12px 10px; font-size:11px; line-height:1.2; font-weight:600; }
.planner-lanes .lane-complete { background:#a6e8bc; color:#153d26; width:69%; }
.planner-lanes .lane-active { background:#cfe0f7; color:#152e4d; margin-left:12%; width:66%; }
.planner-lanes .lane-review { background:#f4d990; color:#493615; margin-left:22%; width:72%; }
.planner-lanes .lane-planned { background:#294b3b; color:#d7ecdf; border:1px dashed #8ba795; margin-left:45%; width:55%; }
.planner-diagram-foot { display:flex; flex-wrap:wrap; gap:8px; padding-top:20px; }
.planner-diagram-foot span { border:1px solid #627d6c; border-radius:25px; padding:5px 10px; font-size:11px; }
.planner-diagram > p { color:#bed6c8; font-size:11px; margin:18px 0 0; }
.planner-menu { padding-top:20px; }
.planner-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; padding-left:24px; }
.planner-steps li { padding-left:6px; }
.planner-steps li::marker { color:#087548; font-weight:800; }
.planner-steps p { font-size:15px; margin-top:12px; }
.planner-flow { display:flex; flex-wrap:wrap; list-style:none; gap:8px; padding:0; margin:30px 0; counter-reset:stage; }
.planner-flow li { counter-increment:stage; border:1px solid #b1c8bb; padding:12px 14px; border-radius:7px; font-size:14px; background:#f2f7f3; }
.planner-flow li::before { content:counter(stage) " / "; color:#087548; font-weight:700; }
.planner-flow li:last-child { background:#c9f0d8; }
.planner-bottom-cta { background:#edf5ef; padding:32px !important; margin-top:35px; border-radius:12px; }
.planner-bottom-cta a.button { color:#fff; text-decoration:none; white-space:normal; text-align:center; }
.planner-page a:focus-visible,.planner-page button:focus-visible { outline:3px solid #d99400; outline-offset:4px; }
@media(max-width:1000px) { .planner-hero-grid { grid-template-columns:1fr; gap:36px; } .planner-diagram { max-width:620px; width:100%; } }
@media(max-width:700px) { .planner-hero { padding:122px 0 44px; } .planner-hero h1 { font-size:clamp(36px,8.7vw,52px); } .planner-lead { font-size:17px; } .planner-steps { grid-template-columns:1fr; gap:14px; } .planner-diagram { padding:18px; } .planner-diagram-head { flex-wrap:wrap; } .planner-lanes li { grid-template-columns:72px 1fr; gap:6px; } .planner-lanes b { font-size:10px; padding:10px 7px; } .planner-menu .project-subnav { display:flex; flex-wrap:nowrap; overflow-x:auto; padding-bottom:12px; } .planner-menu .project-subnav a { flex:0 0 auto; } .planner-bottom-cta { padding:22px !important; } }