@charset "UTF-8";#vp-story-architecture{--vp-yellow:#f6a623;--vp-charcoal:#1a1a1a;--vp-darker:#111;--vp-font-header:'Archivo Narrow',sans-serif;--vp-font-mono:'Roboto Mono',monospace;--vp-font-body:'Inter',sans-serif;position:relative;width:100vw;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;background-color:var(--vp-charcoal);color:#fff;font-family:var(--vp-font-body);padding:8rem 0;box-sizing:border-box;overflow:hidden}#vp-story-architecture *{box-sizing:border-box}#vp-story-architecture .vp-max-width{max-width:1280px;margin:0 auto;padding:0 2rem}#vp-story-architecture .vp-grid{display:grid;grid-template-columns:1fr;gap:6rem;align-items:center}@media (min-width:1024px){#vp-story-architecture .vp-grid{grid-template-columns:1fr 1fr}}#vp-story-architecture .vp-visual-col{position:relative;order:2}@media (min-width:1024px){#vp-story-architecture .vp-visual-col{order:1}}#vp-story-architecture .vp-visual-accent{position:absolute;top:-2.5rem;left:-2.5rem;width:10rem;height:10rem;border-top:4px solid var(--vp-yellow);border-left:4px solid var(--vp-yellow);opacity:0.2;z-index:0}#vp-story-architecture .vp-main-img{width:100%;display:block;filter:grayscale(1) contrast(1.25);border:4px solid var(--vp-charcoal);box-shadow:0 40px 100px rgba(0,0,0,0.6);position:relative;z-index:1}#vp-story-architecture .vp-img-underlay{position:absolute;bottom:-2.5rem;right:-2.5rem;width:10rem;height:10rem;background-color:rgba(246,166,35,0.1);z-index:-1}#vp-story-architecture .vp-project-label{position:absolute;bottom:1.5rem;left:1.5rem;z-index:10;background-color:var(--vp-yellow);color:var(--vp-charcoal);padding:1rem 1.5rem;font-family:var(--vp-font-header);font-weight:900;font-size:1.25rem;text-transform:uppercase;letter-spacing:0.05em}#vp-story-architecture .vp-content-col{order:1}@media (min-width:1024px){#vp-story-architecture .vp-content-col{order:2}}#vp-story-architecture .vp-mono-tag{font-family:var(--vp-font-mono);font-size:0.875rem;color:var(--vp-yellow);text-transform:uppercase;letter-spacing:-0.02em;margin-bottom:1rem;display:block}#vp-story-architecture h2{font-family:var(--vp-font-header);font-size:clamp(2.5rem,6vw,4.2rem);font-weight:900;line-height:0.95;text-transform:uppercase;margin:0 0 3.5rem 0}#vp-story-architecture h2 span{color:var(--vp-yellow)}#vp-story-architecture .vp-steps{display:flex;flex-direction:column;gap:3.5rem}#vp-story-architecture .vp-step{display:flex;gap:2rem}#vp-story-architecture .vp-step-num{font-family:var(--vp-font-header);font-size:3.5rem;font-weight:900;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,0.2);line-height:1;transition:all 0.4s ease;user-select:none}#vp-story-architecture .vp-step:hover .vp-step-num{color:var(--vp-yellow);-webkit-text-stroke:1px var(--vp-yellow)}#vp-story-architecture .vp-step-title{font-family:var(--vp-font-header);font-size:1.5rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;margin-bottom:0.5rem;color:#fff}#vp-story-architecture .vp-step-desc{font-size:1rem;color:#888;line-height:1.6;max-width:24rem;font-weight:300}#vp-story-architecture .vp-cta-banner{margin-top:8rem;background-color:var(--vp-darker);border:1px solid rgba(246,166,35,0.2);padding:3.5rem;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:2.5rem;position:relative}@media (min-width:768px){#vp-story-architecture .vp-cta-banner{flex-direction:row}}#vp-story-architecture .vp-cta-title{font-family:var(--vp-font-header);font-size:2rem;font-weight:900;text-transform:uppercase;margin-bottom:0.5rem}#vp-story-architecture .vp-cta-title span{color:var(--vp-yellow)}#vp-story-architecture .vp-cta-subtitle{font-family:var(--vp-font-mono);font-size:0.7rem;color:#555;text-transform:uppercase;letter-spacing:0.2em;font-weight:700}#vp-story-architecture .vp-cta-btn{background:#fff;color:var(--vp-charcoal);font-family:var(--vp-font-header);font-weight:900;font-size:1rem;padding:1.25rem 2.5rem;text-decoration:none;text-transform:uppercase;transition:all 0.3s cubic-bezier(0.165,0.84,0.44,1);border:2px solid #fff;white-space:nowrap}#vp-story-architecture .vp-cta-btn:hover{background:var(--vp-yellow);border-color:var(--vp-yellow);box-shadow:0 0 20px rgba(246,166,35,0.3)}
