.demo-site{--accent:var(--project-ink);font-size:17px;line-height:1.7}.demo-site em{font-style:normal}.demo-site .eyebrow{text-transform:none;font-size:14px;letter-spacing:.06em}.demo-disclaimer{font-size:14px;line-height:1.5}.demo-header nav,.demo-button,.demo-footer{font-size:15px}.demo-site a:focus-visible,.demo-site button:focus-visible,.demo-site summary:focus-visible{outline:3px solid var(--project-ink);outline-offset:4px}.demo-end a:focus-visible{outline-color:var(--project-bg)}.sample-explorer{padding:45px 6% 85px}.sample-explorer h2{font-size:clamp(40px,5vw,66px);margin:18px 0 32px}.sample-choices,.sample-filters{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}.sample-choices button,.sample-filters button{background:transparent;color:var(--project-ink);border:1px solid currentColor;padding:13px 20px;font:inherit}.sample-choices button[aria-pressed=true],.sample-filters button[aria-pressed=true]{background:var(--project-ink);color:var(--project-bg)}.sample-panel{display:grid;grid-template-columns:1fr 1.15fr;gap:50px;padding:38px;border:1px solid #7777;background:#ffffff21;min-height:360px}.sample-panel h3,.architecture-projects h3{font-size:42px;margin:20px 0 12px;line-height:1.1}.sample-lead{font-family:var(--serif);font-size:26px;line-height:1.3}.sample-panel ul,.architecture-projects ul{padding-left:20px;margin-block:22px}.sample-panel li,.architecture-projects li{padding-block:5px}.sample-panel .demo-button{margin-top:10px}.sample-count{font-size:14px;margin-bottom:20px}.architecture-projects{display:grid;gap:25px}.architecture-projects article{padding:32px;border:1px solid #7777}.architecture-projects details{margin-top:20px}.architecture-projects summary,.sample-questions summary{display:flex;justify-content:space-between;align-items:start;gap:20px;cursor:pointer;list-style:none;padding:20px 0;border-bottom:1px solid #7777;font-weight:500}.architecture-projects summary::-webkit-details-marker,.sample-questions summary::-webkit-details-marker{display:none}.architecture-projects details[open] summary span,.sample-questions details[open] summary span{transform:rotate(45deg)}.architecture-projects h4{font:500 26px var(--serif);margin:25px 0 8px}.sample-questions{padding:20px 6% 80px;display:grid;grid-template-columns:1fr 1.2fr;gap:65px}.sample-questions h2{font-size:48px;margin-top:20px}.sample-questions details p{padding:20px 0}.demo-site.form-field .demo-hero .eyebrow{color:white}.demo-site.form-field .demo-hero>div{background:linear-gradient(90deg,#132216e8,#13221630)}
@media(max-width:760px){.sample-explorer{padding:30px 7% 55px}.sample-panel{grid-template-columns:1fr;padding:25px;gap:22px;min-height:0}.sample-panel h3,.architecture-projects h3{font-size:36px}.sample-choices{gap:8px}.sample-choices button{flex:1 1 180px;text-align:left}.sample-questions{grid-template-columns:1fr;gap:20px;padding:0 7% 55px}.sample-questions h2{font-size:42px}.architecture-projects article{padding:24px}.demo-header nav{flex-wrap:wrap}.demo-site h1{font-size:clamp(48px,11vw,70px)}.demo-story h2{font-size:44px}.demo-disclaimer{font-size:14px}.demo-footer{font-size:14px}}
.demo-site.morrow main{display:flex;flex-direction:column}.demo-site.morrow .demo-hero{display:flex;flex-direction:column;min-height:0;text-align:center;order:0;padding-bottom:60px}.demo-site.morrow .demo-hero>div{padding:65px 8% 35px;width:100%;max-width:1100px;margin:auto}.demo-site.morrow .demo-hero h1{font-size:clamp(70px,9vw,130px);line-height:.94}.demo-site.morrow .demo-hero>div>p{margin-inline:auto}.demo-site.morrow .demo-hero img{width:78%;height:430px;min-height:0;object-fit:cover;border-radius:250px 250px 0 0;margin-inline:auto}.demo-site.morrow .sample-explorer{order:1;background:var(--project-ink);color:var(--project-bg);padding-top:65px}.demo-site.morrow .sample-choices button{color:var(--project-bg);border-radius:40px}.demo-site.morrow .sample-choices button[aria-pressed=true]{background:var(--project-bg);color:var(--project-ink)}.demo-site.morrow .sample-panel{border:0;border-top:1px solid #ead7d860;background:none;padding:35px 0}.demo-site.morrow .sample-panel .demo-button:hover{background:var(--project-bg);color:var(--project-ink)}.demo-site.morrow .sample-explorer :is(button,a):focus-visible{outline-color:var(--project-bg)}.demo-site.morrow .demo-story{order:2}.demo-site.morrow .sample-questions{order:3}.demo-site.morrow .demo-end{order:4}.demo-site.form-field .demo-brand{font-family:var(--sans);letter-spacing:-.055em}.demo-site.form-field .sample-explorer h2{font-family:var(--sans);font-size:clamp(38px,4.5vw,65px);font-weight:500;letter-spacing:-.06em}.demo-site.form-field .architecture-projects{counter-reset:project}.demo-site.form-field .architecture-projects article{counter-increment:project;border:0;border-top:1px solid #7777;padding:35px 0;display:grid;grid-template-columns:80px 1fr 1.15fr;gap:12px 28px}.demo-site.form-field .architecture-projects article::before{content:counter(project,decimal-leading-zero);grid-column:1;grid-row:1/5;font:400 45px var(--sans);opacity:.5}.demo-site.form-field .architecture-projects article>.eyebrow{grid-column:2/4}.demo-site.form-field .architecture-projects h3{grid-column:2;font:500 36px/1.1 var(--sans);letter-spacing:-.045em;margin:8px 0}.demo-site.form-field .architecture-projects .sample-lead{grid-column:2;font:17px/1.6 var(--sans)}.demo-site.form-field .architecture-projects details{grid-column:3;grid-row:2/5;margin:0}.demo-site.form-field .architecture-projects summary{padding-top:7px}.demo-site.form-field .sample-questions{border-top:1px solid #7777;padding-top:60px}
@media(max-width:760px){.demo-site.morrow .demo-hero>div{padding:45px 7% 25px}.demo-site.morrow .demo-hero h1{font-size:clamp(58px,14vw,90px)}.demo-site.morrow .demo-hero img{height:290px;width:86%;border-radius:140px 140px 0 0}.demo-site.morrow .demo-hero{padding-bottom:35px}.demo-site.morrow .sample-explorer{padding-top:45px}.demo-site.morrow .sample-panel{padding-top:28px}.demo-site.form-field .architecture-projects article{grid-template-columns:42px 1fr;gap:10px 16px;padding-block:28px}.demo-site.form-field .architecture-projects article::before{font-size:28px;grid-row:1/4}.demo-site.form-field .architecture-projects article>.eyebrow{grid-column:2}.demo-site.form-field .architecture-projects h3{font-size:30px}.demo-site.form-field .architecture-projects details{grid-column:2;grid-row:auto}.demo-site.form-field .sample-questions{padding-top:40px}}
