#quality.architecture-portrait{position:relative;isolation:isolate;min-height:780px;height:100svh;padding:0;background:#aacbdd;color:white;overflow:hidden;scroll-margin-top:76px}
#quality .portrait-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;z-index:-2}
#quality.architecture-portrait:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#122f352e,transparent 42%,#12252c8c)}
#quality .portrait-heading{position:absolute;left:var(--gutter);top:65px;max-width:520px}
#quality .portrait-heading>p{font:500 9px/1.5 'DM Sans',sans-serif;letter-spacing:.21em;color:#173b42;margin:0 0 24px}
#quality .portrait-heading h2{font:400 clamp(40px,4.2vw,66px)/1.07 Georgia,serif;letter-spacing:-.035em;color:#173b42;margin:0;text-shadow:0 1px 20px #cde3ed66}
#quality .portrait-point{position:absolute;display:flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;background:#f5f5efed;border:1px solid #fff9;border-radius:30px;color:#203e3d;cursor:pointer;box-shadow:0 4px 20px #153c3c18}
#quality .portrait-point>span{display:grid;place-items:center;width:32px;height:32px;border:1px solid #377e86;border-radius:50%;font-size:10px}
#quality .portrait-point>b{font:400 11px 'DM Sans',sans-serif}
#quality .portrait-point[aria-expanded=true]{background:#203e3d;color:white}
#quality .point-colour{left:49%;top:28%}#quality .point-balcony{left:63%;top:54%}#quality .point-street{left:34%;top:80%}
#quality .portrait-detail{position:absolute;right:var(--gutter);bottom:100px;width:320px;background:#f2f1e9;color:#203e3d;padding:30px;box-shadow:0 10px 35px #10292922;z-index:4}
#quality .portrait-detail[hidden]{display:none}
#quality .portrait-close{position:absolute;right:10px;top:8px;width:34px;height:34px;border:0;background:transparent;color:#203e3d;font-size:25px;cursor:pointer}
#quality .portrait-detail-index{font-size:9px;letter-spacing:.15em;color:#397a80;margin:0 0 17px}
#quality .portrait-detail h3{font:400 27px/1.15 Georgia,serif;color:#203e3d;margin:0 0 15px}
#quality .portrait-detail-copy{font:400 13px/1.75 'DM Sans',sans-serif;color:#45615d;margin:0}
#quality .portrait-bottom{position:absolute;bottom:30px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:24px;color:white}
#quality .portrait-bottom>span{font-size:8px;letter-spacing:.2em}#quality .portrait-bottom a{font-size:12px;padding-bottom:9px;border-bottom:1px solid #ffffff70}
#quality button:focus-visible,#quality a:focus-visible{outline:2px solid white;outline-offset:5px}
@media(max-width:760px){#quality.architecture-portrait{min-height:800px;height:100svh}#quality .portrait-image{object-position:51% center}#quality .portrait-heading{left:24px;right:24px;top:40px;max-width:350px}#quality .portrait-heading h2{font-size:39px;color:white;text-shadow:0 2px 18px #102b3b77}#quality .portrait-heading>p{color:white;font-size:8px}#quality.architecture-portrait:after{background:linear-gradient(180deg,#12304080,transparent 45%,#12252caa)}#quality .portrait-point>b{display:none}#quality .portrait-point{padding:5px}#quality .point-colour{left:48%;top:35%}#quality .point-balcony{left:74%;top:54%}#quality .point-street{left:38%;top:76%}#quality .portrait-detail{left:24px;right:24px;bottom:95px;width:auto;padding:24px}#quality .portrait-bottom{left:24px;right:24px;bottom:25px;align-items:start;flex-direction:column;gap:12px}}