/* Shared visual proportions with the other Design & Options pages. */
.glass-page .container{width:calc(100% - clamp(32px,6vw,160px));max-width:1800px;padding-inline:0;margin-inline:auto}
.glass-page .glass-hero{min-height:0;padding:0}
.glass-page .glass-hero-grid{min-height:clamp(410px,24vw,610px);padding-block:110px 40px;align-items:center}
.glass-page .glass-hero-copy{width:52%;max-width:850px}
.glass-page .glass-hero h1{font-size:clamp(36px,3.4vw,64px);line-height:1.08;letter-spacing:-.035em;max-width:22ch;margin:20px 0 18px;text-wrap:balance}
.glass-page .glass-hero-copy>p{font-size:clamp(16px,1.15vw,20px);line-height:1.65;max-width:58ch;margin:0}
.glass-design-link{display:inline-flex;align-items:center;min-height:32px;color:#fff!important;font-size:14px;font-weight:600;text-decoration:none}
.glass-design-link:hover{text-decoration:underline}
.glass-page .glass-hero-art{inset:90px 2% 24px 48%;height:auto;background-position:center;background-size:contain;opacity:.98}
.glass-guide-toolbar{background:#fff;border-bottom:1px solid #d9e6e9;padding:16px 0}
.glass-guide-toolbar>.container{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.glass-guide-toolbar .glass-actions,.glass-guide-toolbar .glass-hero-facts{margin:0}
.glass-guide-toolbar .glass-hero-facts{color:#315563}
.glass-page .glass-section-heading{max-width:1100px;margin-bottom:30px}
.glass-page .glass-section-heading h2,.glass-page .glass-confirm h2,.glass-page>.section>.container>h2{font-size:clamp(28px,2.5vw,40px);line-height:1.18;max-width:32ch;letter-spacing:-.025em}
.glass-page .application-copy h3,.glass-page .loe-copy h3{font-size:clamp(26px,2.2vw,36px);line-height:1.2}
.glass-page .glass-path-grid strong{font-size:17px;line-height:1.35}.glass-page .glass-path-grid span{font-size:15px;line-height:1.6}
.glass-page .loe-tabs small{font-size:12px;letter-spacing:.02em}.glass-page .loe-copy dt,.glass-page .application-copy dt{font-size:12px}
.glass-page .glass-band,.glass-page>.section{padding-block:56px}
/* Keep the full-width hero independent of compact content and media sizing. */
.glass-page>.section>.container,.glass-page>.glass-band>.container{max-width:1440px}
.glass-page .glass-section-heading h2,.glass-page .glass-confirm h2{font-size:clamp(26px,2.2vw,34px);max-width:42ch;line-height:1.22}
.glass-page .glass-section-heading{margin-bottom:24px}
.glass-page .glass-diagram-grid{gap:24px}
.glass-page .glass-diagram{border-radius:16px;box-shadow:0 8px 24px #001e2914}
.glass-page .glass-image-button img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;background:#fff}
.glass-page .glass-diagram>div{padding:20px 24px}
.glass-page .glass-diagram h3{font-size:24px}
.glass-page .appearance-panel{padding:24px;border-radius:16px}
.glass-page .sample-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.glass-page .sample-grid article{padding:12px;border-radius:12px;min-width:0}
.glass-page .glass-sample-image{height:auto;display:block;margin-bottom:12px;border-radius:8px}
.glass-page .glass-sample-art{width:100%;height:auto;aspect-ratio:256 / 440}
.glass-page .sample-grid h4{font-size:15px;line-height:1.35}
.glass-page .sample-grid p{font-size:13px;line-height:1.5}
.glass-page .application-story{grid-template-columns:1fr 1fr;gap:36px;margin-bottom:32px;padding:24px;border:1px solid #dce7ea;border-radius:16px;background:#fff}
.glass-page .application-story:last-child{margin-bottom:0}
.glass-page .application-media{border-radius:12px;box-shadow:none}
.glass-page .application-media img{display:block;width:100%;height:auto;object-fit:contain}
.glass-page .application-copy h3,.glass-page .loe-copy h3{font-size:28px;margin-bottom:16px}
.glass-page .application-copy dl div{padding:10px 0}
.glass-page .loe-stage article{min-height:360px}
.glass-page .loe-visual{padding:0;align-items:center}.glass-page .loe-visual button{height:auto}.glass-page .loe-visual img{display:block;width:100%;height:auto;object-fit:contain}
.glass-page .loe-copy{padding:24px 32px}
.glass-page .glass-path-grid li{min-height:0;padding:22px 20px}.glass-page .glass-path-grid b{margin-bottom:16px}
@media(max-width:1100px){.glass-page .sample-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.glass-page .sample-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.glass-page .application-story{grid-template-columns:1fr;padding:16px;gap:20px}}
@media(max-width:480px){.glass-page .sample-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.glass-page .appearance-panel{padding:14px}.glass-page .sample-grid article{padding:8px}.glass-page .loe-copy{padding:20px}.glass-page .application-copy h3{font-size:24px}}
@media(max-width:1050px){.glass-page .glass-hero-copy{width:60%}.glass-page .glass-hero-art{opacity:.5;left:45%}.glass-page .glass-path-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.glass-page .glass-hero-grid{min-height:380px;padding-block:110px 30px}.glass-page .glass-hero-copy{width:100%;max-width:none}.glass-page .glass-hero h1{font-size:36px;max-width:20ch}.glass-page .glass-hero-art{inset:80px -12% 20px 25%;opacity:.2}.glass-guide-toolbar .glass-hero-facts{font-size:11px;gap:10px 14px}.glass-guide-toolbar .glass-actions{gap:8px}.glass-page .glass-path-grid{grid-template-columns:1fr}.glass-page .glass-band,.glass-page>.section{padding-block:36px}}
