*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--black: #f0eee8;--white: #111;--gray: #aaa;--cream: #0a0a0a;--purple: #a78bfa;--purple-light: #c4b5fd;--mustard: #e8b830;--mustard-light: #f5d060;--bordeaux: #d45d79;--bordeaux-light: #e87d95;--accent: var(--purple);--accent-hover: var(--purple-light);--bg: var(--cream);--border: 3px solid var(--black);--border-thick: 5px solid var(--black);--shadow: 6px 6px 0 #333;--shadow-sm: 3px 3px 0 #333;--font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;--font-mono: "SF Mono", "Fira Code", "Courier New", monospace}body{font-family:var(--font-sans);font-size:1.125rem;line-height:1.6;color:var(--black);background-color:var(--bg);-webkit-font-smoothing:antialiased}.skip-link{position:absolute;top:-100%;left:1rem;padding:.75rem 1.5rem;background:var(--accent);color:var(--white);font-weight:700;text-decoration:none;z-index:1000;border:var(--border)}.skip-link:focus{top:1rem}.page{max-width:72rem;margin:0 auto;padding:2rem 1.5rem}*:focus-visible{outline:3px solid var(--mustard);outline-offset:3px}.site-header{border-bottom:var(--border-thick);padding-bottom:2rem;margin-bottom:3rem}.site-header h1{font-size:clamp(3rem,8vw,6rem);font-weight:900;letter-spacing:-.03em;line-height:1;text-transform:uppercase;color:var(--purple)}.site-header .tagline{font-size:clamp(1rem,2.5vw,1.5rem);font-weight:400;color:var(--gray);margin-top:.75rem;max-width:40ch}.header-row{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:1rem}.version-badge{font-family:var(--font-mono);font-size:.875rem;padding:.25rem .75rem;border:2px solid var(--black);background:var(--mustard);color:var(--black);font-weight:700}.hero-cta{display:flex;gap:1rem;margin-top:2rem;flex-wrap:wrap}.btn{display:inline-block;padding:1rem 2rem;font-size:1rem;font-weight:800;text-decoration:none;text-transform:uppercase;letter-spacing:.05em;border:var(--border);cursor:pointer;transition:transform .1s ease,box-shadow .1s ease;font-family:var(--font-sans)}.btn:hover,.btn:focus-visible{transform:translate(-3px,-3px);box-shadow:var(--shadow)}.btn:active{transform:translate(0);box-shadow:none}.btn-primary{background:var(--purple);color:var(--cream)}.btn-secondary{background:var(--cream);color:var(--black)}.btn-accent{background:var(--mustard);color:var(--black);border-color:var(--black)}.btn-accent:hover,.btn-accent:focus-visible{background:var(--mustard-light)}section{margin-bottom:4rem}.section-title{font-size:clamp(1.5rem,4vw,2.5rem);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;border-bottom:5px solid var(--purple);padding-bottom:.5rem;margin-bottom:2rem;color:var(--purple-light)}.section-title.accent-mustard{border-bottom-color:var(--mustard);color:var(--mustard-light)}.section-title.accent-bordeaux{border-bottom-color:var(--bordeaux);color:var(--bordeaux-light)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.card{border:var(--border);padding:1.5rem;background:var(--white);transition:transform .1s ease,box-shadow .1s ease;position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--purple);opacity:.7}.card:nth-child(3n+1):before{background:var(--purple)}.card:nth-child(3n+2):before{background:var(--mustard)}.card:nth-child(3n+3):before{background:var(--bordeaux)}.card:hover{transform:translate(-3px,-3px);box-shadow:var(--shadow)}.card h3{font-size:1.25rem;font-weight:800;text-transform:uppercase;margin-bottom:.5rem;color:var(--black)}.card:nth-child(3n+1) h3{color:var(--purple-light)}.card:nth-child(3n+2) h3{color:var(--mustard)}.card:nth-child(3n+3) h3{color:var(--bordeaux-light)}.card p{color:var(--gray);font-size:1rem;line-height:1.5}.card-number{font-family:var(--font-mono);font-size:2.5rem;font-weight:900;line-height:1;color:var(--gray);margin-bottom:.75rem}.feature-list{list-style:none;padding:0}.feature-list li{padding:1rem 0;border-bottom:1px solid var(--gray-light);display:flex;gap:1rem}.feature-list li:last-child{border-bottom:none}.feature-label{font-weight:800;text-transform:uppercase;color:var(--purple);min-width:120px;display:block}.feature-list li:nth-child(3n+2) .feature-label{color:var(--mustard)}.feature-list li:nth-child(3n+3) .feature-label{color:var(--bordeaux)}.links-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}.links-grid a{display:block;padding:1.5rem;border:var(--border);background:var(--white);text-decoration:none;color:var(--black);font-weight:700;text-transform:uppercase;letter-spacing:-.01em;transition:transform .1s ease,box-shadow .1s ease;position:relative;overflow:hidden}.links-grid a:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--purple);opacity:.7}.links-grid a:nth-child(3n+1):before{background:var(--purple)}.links-grid a:nth-child(3n+2):before{background:var(--mustard)}.links-grid a:nth-child(3n+3):before{background:var(--bordeaux)}.links-grid a:hover{transform:translate(-3px,-3px);box-shadow:var(--shadow)}.links-grid a span{display:block;font-size:.875rem;color:var(--gray);margin-top:.5rem;font-weight:400;text-transform:none;letter-spacing:normal}.code-block{background:var(--white);border:var(--border);padding:1.5rem;overflow-x:auto;font-family:var(--font-mono);font-size:.875rem;line-height:1.6;color:var(--black)}.code-block code{display:block}.code-line-comment{color:var(--gray)}footer{margin-top:4rem;padding-top:2rem;border-top:var(--border-thick)}footer nav{display:flex;gap:1.5rem;flex-wrap:wrap}footer a{color:var(--purple);text-decoration:underline;text-underline-offset:3px;font-weight:600}footer a:hover{color:var(--bordeaux)}@media(max-width:640px){.page{padding:1rem}.example-banner{padding:1.5rem;flex-direction:column;text-align:center}.hero-cta{flex-direction:column}.btn{width:100%;text-align:center}.card-number{font-size:2rem}.links-grid{grid-template-columns:1fr}}