body{margin:0;background:#F4F6F9}
a{color:#1F4E9C}a:hover{color:#0B2545}
.bp-grid{background-color:#0B2545;background-image:linear-gradient(rgba(255,255,255,0.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.06) 1px,transparent 1px);background-size:32px 32px}
input,textarea{font:inherit}
@keyframes bpUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes bpDraw{to{stroke-dashoffset:0}}
@keyframes bpDrift{to{background-position:32px 32px,32px 32px}}
@keyframes bpGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes bpFill{0%,55%{opacity:0}100%{opacity:1}}
.bp-in{opacity:0;animation:bpUp .9s cubic-bezier(.2,.7,.2,1) forwards}
.bp-d1{animation-delay:.15s}.bp-d2{animation-delay:.3s}
.bp-logo path{stroke-dasharray:600;stroke-dashoffset:600;animation:bpDraw 1.4s .2s cubic-bezier(.65,0,.35,1) forwards}
.bp-ghost path{stroke-dasharray:600;stroke-dashoffset:600;animation:bpDraw 2.6s .5s cubic-bezier(.65,0,.35,1) forwards}
.bp-ghost rect{opacity:0;animation:bpFill 3.4s .5s ease forwards}
.bp-drift{animation:bpDrift 8s linear infinite}
.bp-card{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s,border-color .3s}
.bp-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(11,37,69,.12);border-color:#1F4E9C}
.bp-btn{transition:transform .2s,filter .2s}.bp-btn:hover{transform:translateY(-2px);filter:brightness(1.12)}
.bp-arrow{display:inline-block;transition:transform .25s}.bp-btn:hover .bp-arrow{transform:translateX(5px)}
.bp-rule{position:relative}
.bp-rule::before{content:"";position:absolute;left:0;top:-2px;width:100%;height:2px;background:#1F4E9C;transform-origin:left}
@supports (animation-timeline: view()){
.bp-reveal{animation:bpUp linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
.bp-rule::before{animation:bpGrow linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
}
@keyframes bpSpin{to{transform:rotate(360deg)}}
.bp-spin{animation:bpSpin 90s linear infinite}
.bp-step{position:relative;isolation:isolate;transition:background-color .3s}
.bp-step:hover{background-color:#F4F6F9}
.bp-node{position:absolute;top:-8px;left:0;width:14px;height:14px;background:#FFFFFF;border:2px solid #1F4E9C;box-sizing:border-box;transition:background-color .25s,transform .3s}
.bp-step:hover .bp-node{background:#1F4E9C;transform:rotate(45deg)}
.bp-ghostletter{position:absolute;z-index:-1;right:24px;top:20px;font-family:'Archivo','Helvetica Neue',sans-serif;font-weight:800;font-size:110px;line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(31,78,156,0.2);pointer-events:none;transition:-webkit-text-stroke-color .3s}
.bp-step:hover .bp-ghostletter{-webkit-text-stroke-color:rgba(31,78,156,0.45)}
@keyframes bpPop{0%{transform:scale(0) rotate(45deg)}70%{transform:scale(1.4) rotate(45deg)}100%{transform:scale(1) rotate(0)}}
@keyframes bpRise{from{opacity:0;transform:translateY(60px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
.bp-step{animation:bpUp linear both;animation-timeline:view()}
.bp-step .bp-node{animation:bpPop linear both;animation-timeline:view()}
.bp-step .bp-ghostletter{animation:bpRise linear both;animation-timeline:view()}
.bp-s1,.bp-s1 .bp-node,.bp-s1 .bp-ghostletter{animation-range:entry 10% entry 55%}
.bp-s2,.bp-s2 .bp-node,.bp-s2 .bp-ghostletter{animation-range:entry 25% entry 70%}
.bp-s3,.bp-s3 .bp-node,.bp-s3 .bp-ghostletter{animation-range:entry 40% entry 85%}
.bp-s4,.bp-s4 .bp-node,.bp-s4 .bp-ghostletter{animation-range:entry 55% entry 100%}
}
@media (prefers-reduced-motion:reduce){.bp-step,.bp-step .bp-node,.bp-step .bp-ghostletter{animation:none!important;opacity:1;transform:none}}
@supports (animation-timeline: view()){
#contact{view-timeline-name:--contact}
.bp-skyline{animation:bpUp linear both;animation-timeline:--contact;animation-range:entry 0% entry 60%}
}
@media (prefers-reduced-motion:reduce){.bp-skyline{animation:none!important;opacity:1;transform:none}}
.bp-flag{opacity:.55;transition:opacity .2s,box-shadow .2s}.bp-flag:hover{opacity:1}.bp-flag[aria-current="true"]{opacity:1;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6)}
@keyframes fade{to{opacity:1}}.bp-hero-city .base{opacity:0;animation:fade 1s .3s forwards}.bp-hero-city .c1,.bp-hero-city .c2{stroke-dasharray:1;stroke-dashoffset:1;animation:bpDraw 3.6s .5s cubic-bezier(.45,0,.25,1) forwards}.bp-hero-city .c2{animation-duration:1.6s;animation-delay:3.6s}@media (prefers-reduced-motion:reduce){.bp-hero-city .base{animation:none;opacity:1}.bp-hero-city .c1,.bp-hero-city .c2{animation:none!important;stroke-dashoffset:0!important}}
@keyframes pwl0{0%,4.44%{stroke-dashoffset:1;opacity:1}14.44%,88%{stroke-dashoffset:0;opacity:1}95%,100%{stroke-dashoffset:0;opacity:0}}.pw-l0{stroke-dasharray:1;stroke-dashoffset:1;animation:pwl0 9.0s linear infinite}
@keyframes pwl1{0%,17.22%{stroke-dashoffset:1;opacity:1}27.22%,88%{stroke-dashoffset:0;opacity:1}95%,100%{stroke-dashoffset:0;opacity:0}}.pw-l1{stroke-dasharray:1;stroke-dashoffset:1;animation:pwl1 9.0s linear infinite}
@keyframes pwl2{0%,30.00%{stroke-dashoffset:1;opacity:1}40.00%,88%{stroke-dashoffset:0;opacity:1}95%,100%{stroke-dashoffset:0;opacity:0}}.pw-l2{stroke-dasharray:1;stroke-dashoffset:1;animation:pwl2 9.0s linear infinite}
@keyframes pwl3{0%,42.78%{stroke-dashoffset:1;opacity:1}52.78%,88%{stroke-dashoffset:0;opacity:1}95%,100%{stroke-dashoffset:0;opacity:0}}.pw-l3{stroke-dasharray:1;stroke-dashoffset:1;animation:pwl3 9.0s linear infinite}
@keyframes pwl4{0%,55.56%{stroke-dashoffset:1;opacity:1}65.56%,88%{stroke-dashoffset:0;opacity:1}95%,100%{stroke-dashoffset:0;opacity:0}}.pw-l4{stroke-dasharray:1;stroke-dashoffset:1;animation:pwl4 9.0s linear infinite}
@keyframes pwsig{0%,69.44%{stroke-dashoffset:1;opacity:1}80.56%,88%{stroke-dashoffset:0;opacity:1}95%,100%{opacity:0;stroke-dashoffset:0}}.pw-sig{stroke-dasharray:1;stroke-dashoffset:1;animation:pwsig 9.0s linear infinite}
@keyframes pwseal{0%,83.89%{opacity:0;transform:scale(1.8)}86.67%{opacity:1;transform:scale(.92)}88.33%,88%{opacity:1;transform:scale(1)}95%,100%{opacity:0;transform:scale(1)}}.pw-seal{transform-box:fill-box;transform-origin:center;opacity:0;animation:pwseal 9.0s ease-out infinite}
@keyframes pwpen{0%{transform:translate(134px,80px);opacity:0}2.22%{opacity:1}4.44%{transform:translate(134px,80px);opacity:1}14.44%{transform:translate(226px,80px);opacity:1}17.22%{transform:translate(134px,100px);opacity:1}27.22%{transform:translate(206px,100px);opacity:1}30.00%{transform:translate(134px,120px);opacity:1}40.00%{transform:translate(222px,120px);opacity:1}42.78%{transform:translate(134px,140px);opacity:1}52.78%{transform:translate(196px,140px);opacity:1}55.56%{transform:translate(134px,160px);opacity:1}65.56%{transform:translate(214px,160px);opacity:1}69.44%{transform:translate(134px,186px);opacity:1}80.56%{transform:translate(192px,184px);opacity:1}90.56%{transform:translate(262px,150px);opacity:0}100%{transform:translate(262px,150px);opacity:0}}.pw-pen{animation:pwpen 9.0s linear infinite}
@media (prefers-reduced-motion:reduce){.bp-illos *{animation:none!important}.bp-illos [class^=pw-l],.pw-sig{stroke-dashoffset:0!important}.pw-seal,[class^=cr-f]{opacity:1!important}.pw-pen,.cr-load{opacity:0!important}.cr-trolley{transform:translateX(318px)}.cr-hook{transform:translateY(70px)}}
.bp-illos path,.bp-illos rect,.bp-illos circle{vector-effect:non-scaling-stroke}
@media (max-width:760px){.bp-ghost-wrap{display:none}}
@media (prefers-reduced-motion:reduce){
.bp-in,.bp-reveal{animation:none!important;opacity:1;transform:none}
.bp-logo path,.bp-ghost path{animation:none;stroke-dashoffset:0}
.bp-ghost rect{animation:none;opacity:1}
.bp-drift,.bp-spin{animation:none}
.bp-rule::before{animation:none!important;transform:none}
}
.bp-wheel{transform-box:view-box;transform-origin:150px 220px;animation:bpSpin 40s linear infinite}
@media (prefers-reduced-motion:reduce){.bp-wheel{animation:none}}
/* ---- BluePlan design system ---- */
body{background:#FFFFFF}
.ds-peg{display:inline-block;width:.15em;height:.15em;margin-left:.07em;background:#E8913A;vertical-align:baseline}
.bp-card{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,border-color .25s}
.bp-card:hover{transform:translateY(-4px);box-shadow:0 1px 2px rgba(7,26,51,0.06),0 16px 36px rgba(7,26,51,0.12);border-color:#0B2545}
@media (prefers-reduced-motion:reduce){.bp-card:hover{transform:none}}
.bp-btn{transition:filter .15s,box-shadow .15s,border-color .15s}
.bp-btn:hover{transform:none;filter:none}
.ds-primary:hover{filter:brightness(.92)}
.ds-accent:hover{box-shadow:inset 0 -3px 0 #0B2545}
.ds-secondary:hover{border-color:#FFFFFF!important}
.ds-nav{color:#DCE4F0;text-decoration:none;font-weight:600;font-size:15px;padding:10px 0;border-bottom:2px solid transparent}
.ds-nav:hover{color:#FFFFFF;border-bottom-color:#8DB0E8}
.ds-input:hover{border-color:#0B2545!important}
.ds-input:focus{border-color:#0B2545!important}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #1F4E9C;outline-offset:2px}
header a:focus-visible,#top a:focus-visible,footer a:focus-visible{outline-color:#F0A04B}
.bp-node{border-color:#1F4E9C}
.bp-step:hover .bp-node{background:#0B2545;border-color:#0B2545}
.bp-step:hover{background-color:#F4F6F9}
.bp-rule::before{background:#0B2545}
/* ---- Mobile ---- */
@media (max-width:640px){
header>div{flex-wrap:nowrap!important;padding-top:12px!important;padding-bottom:12px!important}
header nav{gap:0!important;flex-wrap:nowrap!important}
header nav .ds-nav,header nav .ds-secondary{display:none!important}
.bp-flag{width:40px!important;height:40px!important}
#top>div{padding-top:44px!important;padding-bottom:110px!important;gap:24px!important}
#top h1{margin-bottom:18px!important}
#top p{font-size:17px!important;margin-bottom:28px!important}
#top .bp-btn{width:100%;justify-content:center}
.bp-illos{display:none}
.bp-card{padding:24px!important}
.bp-ghostletter{display:none}
.bp-rule{border-top:0!important;border-left:2px solid #D5DDE8;margin-left:6px}
.bp-rule::before{display:none}
.bp-step{padding:0 0 32px 26px!important}
.bp-step:last-child{padding-bottom:4px!important}
.bp-node{top:3px;left:-8px}
#contact>div[style*="max-width"]{gap:28px!important;padding-top:120px!important}
#approach h2{margin-bottom:36px!important}
#contact button[type=submit]{width:100%;justify-content:center}
footer>div{flex-direction:column;align-items:flex-start!important;gap:10px!important}
}