.architecture-sketch{background-image:url("../images/architecture-sketch.jpg");}
/* DESIGN 1 HERO — shared typography + responsive layout */
:root{--cw-blue:#1266c9;--cw-navy:#102a43;--cw-ink:#172c3d;--cw-muted:#62717e;--cw-line:#dde4e9;--cw-font:Arial,Helvetica,sans-serif;}
*{box-sizing:border-box;}
body{margin:0;font:400 16px/1.75 var(--cw-font);color:var(--cw-ink);background:#fff;}
a{color:inherit;text-decoration:none;}
.cw-container{width:min(1440px,90%);margin-inline:auto;}
.cw-heading{font-weight:500;line-height:1.12;letter-spacing:-.045em;font-size:clamp(34px,4vw,56px);margin:0 0 26px;color:var(--cw-navy);}
.cw-heading--hero{font-size:clamp(48px,5.1vw,79px);max-width:650px;}
.cw-text{font-size:16px;line-height:1.85;margin:0 0 22px;color:var(--cw-muted);}
.cw-eyebrow{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--cw-blue);display:flex;align-items:center;gap:12px;margin-bottom:25px;}
.cw-eyebrow:before{content:'';width:28px;height:1px;background:currentColor;}
.cw-button{display:inline-flex;gap:25px;align-items:center;justify-content:center;background:var(--cw-blue);color:#fff;padding:16px 27px;border:1px solid var(--cw-blue);font-size:14px;line-height:1.5;font-weight:600;transition:background .2s,transform .2s;}
.cw-button:hover{background:var(--cw-navy);border-color:var(--cw-navy);color:#fff;transform:translateY(-2px);}
.cw-link{font-size:14px;border-bottom:1px solid #9aabb8;padding-bottom:5px;display:inline-flex;gap:24px;align-items:center;}
.cw-link:hover{color:var(--cw-blue);}
.cw-hero{position:relative;overflow:hidden;background:#f8f9f8;}
.cw-hero-grid{display:grid;grid-template-columns:46% 54%;min-height:730px;align-items:center;}
.cw-hero-copy{padding:72px 0 90px;position:relative;z-index:2;}
.cw-hero-copy .cw-text{max-width:450px;font-size:18px;}
.cw-hero-actions{display:flex;align-items:center;gap:30px;margin-top:35px;}
.cw-hero-note{display:flex;align-items:center;gap:10px;margin-top:64px;color:var(--cw-muted);font-size:11px;letter-spacing:.12em;text-transform:uppercase;}
.cw-hero-note:before{content:'';width:6px;height:6px;background:var(--cw-blue);border-radius:50%;box-shadow:0 0 0 5px #1266c90e;}
.visual{position:relative;width:100%;height:660px;min-width:0;align-self:center;contain:layout paint;}
.architecture-sketch{position:absolute;inset:0 -12% 0 -6%;background-position:center;background-size:cover;opacity:.24;pointer-events:none;mask-image:linear-gradient(90deg,transparent,#000 22%,#000 88%,transparent);}
#stage{position:absolute;inset:15px -3% 85px -3%;cursor:grab;touch-action:pan-y;}
#stage:active{cursor:grabbing;}
#stage canvas{display:block;width:100%;height:100%;}
.contact-shadow{position:absolute;left:24%;right:14%;bottom:170px;height:27px;background:#1c2731;filter:blur(18px);opacity:.17;border-radius:50%;pointer-events:none;}
.drag-hint{position:absolute;top:20px;right:8px;font-size:9px;letter-spacing:.18em;color:#6d7d86;}
.status{position:absolute;left:6%;right:0;bottom:22px;padding-top:19px;border-top:1px solid #c9d2da;}
.stage-row{display:flex;align-items:center;gap:18px;}
.number{font-size:10px;letter-spacing:.18em;color:var(--cw-blue);}
#phase-name{font-size:17px;color:var(--cw-navy);}
#phase-detail{font-size:12px;color:var(--cw-muted);margin:4px 0 14px;}
.progress-track{height:2px;background:#dbe2e7;}
#progress-line{height:100%;background:var(--cw-blue);transform-origin:left;}
:focus-visible{outline:2px solid var(--cw-blue);outline-offset:5px;}
@media(min-width:1800px){.cw-hero-grid{min-height:800px;}.visual{height:740px;}}
@media(max-width:1199px){.cw-heading--hero{font-size:60px;}.cw-hero-grid{min-height:680px;}.visual{height:610px;}}
@media(max-width:991px){.cw-hero-grid{grid-template-columns:1fr;}.cw-hero-copy{padding:60px 0 0;}.cw-heading--hero{max-width:720px;}.cw-hero-copy .cw-text{max-width:600px;}.cw-hero-note{margin-top:30px;}.visual{height:580px;}}
@media(max-width:767px){.cw-heading--hero{font-size:49px;}.cw-hero-copy .cw-text{font-size:16px;}.cw-hero-actions{gap:22px;}.visual{height:490px;}.status{left:0;}.drag-hint{font-size:8px;}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;}}
