.design-page{max-width:1280px;color:var(--v-ink);margin:auto;padding:30px 40px 80px}.design-breadcrumb{color:var(--v-muted);align-items:center;gap:8px;margin-bottom:30px;font-size:11px;display:flex}.design-breadcrumb a:hover{color:var(--v-ink)}.design-hero{grid-template-columns:.9fr 1.1fr;align-items:center;gap:60px;display:grid}.design-intro h1{letter-spacing:-2px;margin:20px 0;font-size:clamp(34px,4vw,54px);font-weight:550;line-height:1.08}.design-intro>p{color:var(--v-muted);font-size:15px;line-height:1.8}.design-tags{flex-wrap:wrap;align-items:center;gap:8px;margin:24px 0;display:flex}.design-tags>span:not(.access-badge){border:1px solid var(--v-line);border-radius:5px;padding:5px 9px;font-size:10px}.design-intro .design-access{max-width:350px;margin-top:15px;font-size:11px;line-height:1.7}.design-access a,.design-setup p a{text-underline-offset:3px;text-decoration:underline}.design-hero-image{border:1px solid var(--v-line);background:var(--v-paper);border-radius:16px;display:block;overflow:hidden;box-shadow:0 15px 45px #24272308}.design-hero-image>img{object-fit:cover;object-position:top;width:100%;height:400px;display:block}.design-hero-image>span{border-top:1px solid var(--v-line);justify-content:space-between;align-items:center;padding:14px 18px;font-size:11px;display:flex}.design-notes{border-top:1px solid var(--v-line);grid-template-columns:1fr 1fr;gap:70px;margin-top:60px;padding-top:40px;display:grid}.design-notes h2,.design-setup h2,.design-section-heading h2{letter-spacing:-.7px;margin:12px 0 18px;font-size:25px;font-weight:550;line-height:1.3}.design-notes h3{margin:25px 0 8px;font-size:15px;font-weight:600}.design-notes p,.design-setup p{color:var(--v-muted);font-size:13px;line-height:1.9}.design-notes ul{gap:18px;padding:0;list-style:none;display:grid}.design-notes li{gap:10px;font-size:13px;line-height:1.8;display:flex}.design-notes li svg{color:#8b7854;flex-shrink:0;margin-top:4px}.design-setup{background:var(--v-soft);border:1px solid var(--v-line);border-radius:14px;align-items:center;gap:50px;margin-top:45px;padding:30px;display:flex}.design-setup>div{flex:1}.design-setup .v1-button{flex-shrink:0}.design-setup p+p{margin-top:10px}.design-related{margin-top:55px;scroll-margin-top:100px}.design-section-heading{justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px;display:flex}.design-section-heading>a{color:var(--v-muted);align-items:center;gap:5px;font-size:11px;display:flex}.design-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;display:grid}.design-card{border:1px solid var(--v-line);background:var(--v-paper);border-radius:12px;transition:transform .15s,box-shadow .15s;display:block;overflow:hidden}.design-card:hover{transform:translateY(-3px);box-shadow:0 10px 25px #2427230b}.design-card>img{object-fit:cover;object-position:top;border-bottom:1px solid var(--v-line);width:100%;height:220px}.design-card>div{padding:18px}.design-card h3{margin:0 0 10px;font-size:15px;font-weight:550;line-height:1.4}.design-card p{color:var(--v-muted);margin-top:12px;font-size:11px;line-height:1.8}.design-card .access-badge{padding:3px 7px;font-size:9px}.design-index-intro{max-width:640px;padding:35px 0 5px}.design-index-intro h1{letter-spacing:-2px;margin:22px 0;font-size:clamp(40px,5vw,62px);font-weight:550;line-height:1.1}.design-index-intro h1 em{color:#b7522b;font-family:Georgia,serif;font-weight:400}.design-index-intro p{color:var(--v-muted);max-width:520px;font-size:14px;line-height:1.8}.design-index-intro nav{gap:10px;margin-top:24px;display:flex}.design-index-intro nav a{border:1px solid var(--v-line);border-radius:7px;padding:9px 14px;font-size:11px}.design-page :focus-visible{outline-offset:4px;outline:2px solid #c7683d}.design-detail-link{color:var(--v-muted);align-items:center;gap:5px;margin:8px 2px 0;font-size:10px;display:inline-flex}.design-detail-link:hover{color:var(--v-ink)}@media (max-width:800px){.design-page{padding:24px 22px 55px}.design-hero{grid-template-columns:1fr;gap:28px}.design-hero-image>img{height:340px}.design-intro h1{max-width:600px}.design-notes{gap:30px;margin-top:35px;padding-top:28px}.design-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.design-setup{flex-direction:column;align-items:flex-start;gap:24px}.design-section-heading{flex-direction:column;align-items:flex-start;gap:0}}@media (max-width:500px){.design-page{padding:22px 18px 40px}.design-intro h1{font-size:38px}.design-hero-image>img{height:290px}.design-notes,.design-grid{grid-template-columns:1fr}.design-notes h2,.design-section-heading h2{font-size:22px}.design-card>img{height:240px}.design-setup{padding:22px}.design-index-intro{padding-top:16px}}
