:root{--ink:#171715;--ivory:#f7f1e5;--gold:#e8ba54;--muted:#c4beb2;--border:#b48c3b80;--radius:22px;--content-width:1280px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{background:var(--ink);color:var(--ivory);margin:0;font-family:Arial,Helvetica,sans-serif;line-height:1.6}a{color:inherit}button,a{-webkit-tap-highlight-color:transparent}:is(a:focus-visible,button:focus-visible){outline:3px solid var(--gold);outline-offset:6px}.skip{z-index:5;background:var(--ivory);color:var(--ink);padding:12px;position:absolute;top:-100px;left:20px}.skip:focus{top:12px}.design-page{max-width:1440px;margin:auto;padding:30px 6vw 0;position:relative;overflow:hidden}.ambient{pointer-events:none;z-index:-1;background:radial-gradient(at 85% 20%,#8c632527,#0000 40%);position:absolute;inset:0}.preview-bar{border:1px solid var(--border);background:#111110;border-radius:60px;justify-content:space-between;align-items:center;gap:20px;padding:17px 28px;display:flex;box-shadow:0 12px 35px #0003}.wordmark{font:italic 700 25px Georgia,serif}.preview-label,.eyebrow{letter-spacing:2px;color:var(--gold);font-size:11px;font-weight:700}.preview-label span{color:#777;margin:0 10px}.preview-bar a{font-size:12px;text-decoration:none}.hero-grid{grid-template-columns:1.5fr 1fr;align-items:center;gap:8%;padding:90px 0 75px;display:grid}h1{letter-spacing:-1.7px;margin:22px 0;font:clamp(40px,4.5vw,68px)/1.12 Georgia,serif}h1 em{color:var(--gold);font-weight:400}h2{margin:12px 0 24px;font:italic 32px/1.2 Georgia,serif}h3{margin:14px 0;font-size:19px;line-height:1.35}.gold-stroke{background:linear-gradient(90deg,var(--gold),#fff0);width:150px;height:3px;margin:24px 0;transform:skew(-30deg)}.lead{max-width:560px;color:var(--muted);font-size:16px}.actions{flex-wrap:wrap;gap:14px;margin-top:30px;display:flex}.button{border:1px solid var(--gold);color:#201a10;background:linear-gradient(110deg,#efc871,#e7b443);border-radius:40px;justify-content:space-between;align-items:center;gap:24px;padding:12px 22px;font-size:13px;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s;display:inline-flex}.button:hover{transform:translateY(-2px);box-shadow:0 5px 24px #d5a73b26}.button.secondary{color:var(--ivory);background:0 0}.caption{color:#a9a396;margin-top:22px;font-size:11px}.panel{border:1px solid var(--border);border-radius:var(--radius);background:linear-gradient(140deg,#22221e,#161613);padding:28px;box-shadow:0 12px 30px #0002}.brand-panel{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:330px;display:flex;position:relative;overflow:hidden}.brand-panel:before{content:"";pointer-events:none;border:1px solid #b48c3b77;border-radius:50%;width:300px;height:180px;position:absolute;transform:rotate(-26deg)}.brand-panel p,.brand-panel small{position:relative}.brand-panel p{margin-bottom:0}.brand-panel small{color:var(--muted);font-size:11px}.logo-slot{place-items:center;width:160px;height:160px;margin:16px;display:grid;position:relative}.logo-slot img{object-fit:contain;max-width:100%}.logo-fallback{color:var(--gold);place-items:center;display:grid}.logo-fallback>span{font-size:64px;line-height:1.1}.logo-fallback small{font-size:12px}.section-heading{justify-content:space-between;align-items:center;gap:20px;display:flex}.component-grid{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.component-grid p:not(.eyebrow){color:var(--muted);font-size:13px}.light-panel{background:var(--ivory);color:var(--ink);border-color:#d7b873}.light-panel .eyebrow{color:#80601f}.swatches{gap:16px;margin-top:24px;display:flex}.swatches>div{flex-direction:column;flex:1;font-size:11px;display:flex}.swatches i{border:1px solid #0002;border-radius:10px;width:100%;height:56px;margin-bottom:10px}.ink{background:var(--ink)}.gold{background:var(--gold)}.ivory{background:var(--ivory)}code{opacity:.65;font-size:10px}.serif{font:italic 25px Georgia,serif}.type-sample{color:var(--gold);margin-top:22px;font:42px Georgia,serif}.type-sample span{color:var(--muted);margin-left:10px;font:12px Arial,sans-serif}.badge{white-space:nowrap;color:var(--gold);border:1px solid #a4823d;border-radius:30px;align-items:center;padding:6px 12px;font-size:11px;display:inline-flex}.empty-state{border-bottom:1px solid #ffffff15;padding:18px 0}.component-grid small{color:var(--muted);font-size:11px}.architecture{background:linear-gradient(120deg,#27251c,#181815);margin:40px 0;padding:36px}.architecture>div>p:not(.eyebrow){color:var(--muted);font-size:13px}.architecture-items{border-top:1px solid var(--border);grid-template-columns:repeat(3,1fr);gap:30px;margin-top:30px;padding-top:25px;display:grid}.architecture-items span{color:var(--gold);font:italic 23px Georgia,serif}.architecture-items h3{font-size:15px}.architecture-items p{color:var(--muted);font-size:12px}footer{border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:20px;padding:26px 0 32px;display:flex}footer p,footer a{color:var(--muted);font-size:11px}@media (max-width:900px){.hero-grid{gap:25px;padding-top:60px}.component-grid{grid-template-columns:1fr}.preview-label{display:none}.swatches i{max-width:100px}.brand-panel{padding:20px}.architecture-items{gap:20px}.section-heading{align-items:flex-start}.section-heading .badge{margin-top:12px}}@media (max-width:600px){.design-page{padding:18px 20px 0}.preview-bar{padding:14px 18px}.wordmark{font-size:21px}.preview-bar a{font-size:10px}.hero-grid{grid-template-columns:1fr;padding-top:40px}.brand-panel{min-height:280px}.hero-grid h1{font-size:42px}.section-heading{margin-bottom:24px;display:block}h2{font-size:28px}.architecture{padding:24px}.architecture-items{grid-template-columns:1fr;gap:16px}.architecture-items>div{border-bottom:1px solid #fff1;padding-bottom:10px}footer{flex-wrap:wrap}footer p{order:3;width:100%;margin:0}.actions{gap:10px}.button{padding:12px 16px;font-size:12px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}}