:root{--bg-canvas:#12332b;--bg-surface:#20463b;--bg-surface-hover:#295345;--text-primary:#e0f2f1;--text-muted:#bdd0c7;--accent-primary:#ff6f59;--accent-secondary:#ffc0ad;--border-subtle:rgba(224,242,241,.16);--ease-kinetic:cubic-bezier(.16,1,.3,1);--shadow-elevation:0 16px 32px -4px rgba(0,0,0,.26);--glow-accent:0 0 0 1px rgba(255,111,89,.35);--glass-backdrop:blur(20px) saturate(190%);--radius:20px}
*{box-sizing:border-box;overflow-wrap:anywhere;hyphens:auto}html{scroll-behavior:smooth}body{margin:0;background:var(--bg-canvas);color:var(--text-primary);font:1rem/1.7 system-ui,sans-serif}a{color:inherit;text-decoration-thickness:1px;text-underline-offset:5px}a:hover{color:var(--accent-secondary)}button,input,textarea,select{font:inherit}button,a,input,textarea,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent-secondary);outline-offset:5px}h1,h2,h3,h4,.eyebrow,.brand,.nav{font-family:"Arial Narrow","Helvetica Neue",sans-serif;text-transform:uppercase;letter-spacing:.09em;line-height:1.2}h1{font-size:clamp(2.5rem,5vw,3.5rem);margin:.4em 0}h2{font-size:2rem;margin:0 0 1rem}h3{font-size:1.5rem;margin:0 0 .8rem}h4{font-size:1.05rem}p{margin:0 0 1.2rem}img{display:block;width:100%;object-fit:cover}figure{margin:0}figcaption,.small{font-size:.875rem;color:var(--text-muted)}ul,ol{padding-left:1.4rem}li{margin:.45rem 0}strong{color:var(--text-primary)}.wrap{width:min(1100px,calc(100% - 48px));margin-inline:auto}.skip{position:absolute;top:-100px;left:12px;background:var(--accent-primary);color:var(--bg-canvas);padding:10px;z-index:20}.skip:focus{top:10px}.site-header{position:relative;background:transparent;z-index:5;transition:background .3s}.site-header.scrolled{background:var(--bg-surface)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:94px;padding:16px 28px}.brand{display:flex;align-items:center;gap:10px;font-size:1rem;font-weight:800;text-decoration:none;flex-shrink:0;letter-spacing:.035em}.brand-mark{display:grid;place-items:center;width:33px;height:33px;border:2px solid var(--accent-primary);border-radius:8px;color:var(--accent-primary);font-size:20px}.nav{display:flex;gap:22px;align-items:center;font-size:.72rem;font-weight:700}.nav a{position:relative;text-decoration:none;padding:8px 0}.nav a::after,.text-link::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--accent-primary);transition:width .3s}.nav a:hover::after,.nav a[aria-current=page]::after,.text-link:hover::after{width:100%}.menu-toggle{display:none;background:none;border:1px solid var(--border-subtle);border-radius:10px;color:var(--text-primary);font-size:1.8rem;width:44px;height:44px;line-height:1}.eyebrow{font-size:.75rem;color:var(--accent-secondary);font-weight:700;margin-bottom:20px}.hero{padding:60px 0 90px}.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:45px;align-items:center}.hero p{max-width:48ch;color:var(--text-muted)}.hero-images{position:relative;min-height:440px}.hero-images img{position:absolute;border-radius:20px;box-shadow:var(--shadow-elevation);border:5px solid var(--bg-canvas)}.timber-joint-image{width:67%;height:310px;left:0;top:0;transform:rotate(-4deg)}.tile-edge-image{width:57%;height:260px;right:0;top:100px;transform:rotate(5deg)}.cabinet-hardware-image{width:48%;height:190px;bottom:0;left:12%;transform:rotate(-2deg)}.image-note{margin-top:20px;font-size:.78rem;color:var(--text-muted)}.button{display:inline-block;border:0;border-radius:12px;background:var(--accent-primary);color:#12332b;padding:13px 22px;text-decoration:none;font-weight:750;line-height:1.5;transition:transform .3s,background .3s}.button:hover{color:#12332b;background:var(--accent-secondary);transform:translateY(-2px)}.button.secondary{background:transparent;color:var(--text-primary);border:1px solid var(--border-subtle)}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:24px}.text-link{display:inline-block;position:relative;text-decoration:none;padding-bottom:4px;font-weight:650}.band{padding:76px 0}.band.surface{background:var(--bg-surface)}.section-head{max-width:720px;margin-bottom:32px}.section-head p{color:var(--text-muted)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}.card,.panel{background:var(--bg-surface);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow-elevation)}.surface .card,.surface .panel{background:var(--bg-canvas)}.card{transition:transform .4s var(--ease-kinetic),box-shadow .4s var(--ease-kinetic)}.card:hover{transform:translateY(-6px) scale(1.01);box-shadow:var(--shadow-elevation),var(--glow-accent)}.card p{color:var(--text-muted)}.card .number{display:block;color:var(--accent-primary);font-size:.8rem;letter-spacing:.15em;margin-bottom:24px}.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.banner-image{aspect-ratio:16/9;border-radius:var(--radius)}.grid-image{aspect-ratio:4/3;border-radius:var(--radius);margin-bottom:22px}.thumbnail{width:90px;height:90px;aspect-ratio:1;border-radius:16px;flex-shrink:0}.media-row{display:flex;align-items:center;gap:20px}.checklist{list-style:none;padding:0;margin:0}.checklist li{position:relative;padding:14px 0 14px 32px;border-bottom:1px solid var(--border-subtle)}.checklist li::before{content:"↳";position:absolute;left:0;color:var(--accent-primary)}.budget-stack{display:grid;gap:14px}.budget-line{display:flex;justify-content:space-between;gap:24px;padding:20px;background:var(--bg-canvas);border-radius:16px}.budget-line strong{white-space:nowrap}.page-intro{padding:56px 0 48px}.page-intro p{max-width:68ch;color:var(--text-muted)}.article-body{max-width:70ch;margin:0 auto}.article-body section{margin-bottom:42px}.article-body h2{font-size:1.7rem}.article-body h3{font-size:1.25rem}.article-body p,.article-body li{color:var(--text-muted)}.article-body strong{color:var(--text-primary)}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:48px;align-items:start}.article-aside{padding:24px;background:var(--bg-surface);border-radius:var(--radius)}.article-aside h2{font-size:1.1rem}.article-aside a{display:block;margin:12px 0}.callout{border-left:3px solid var(--accent-primary);padding:20px 24px;background:var(--bg-surface);border-radius:0 20px 20px 0;margin:30px 0}.table-wrap{margin:24px 0;border-radius:16px;background:var(--bg-surface)}table{width:100%;border-collapse:collapse;min-width:610px;text-align:left}caption{text-align:left;padding:18px;font-weight:700}th,td{padding:16px;border-bottom:1px solid var(--border-subtle);vertical-align:top}th{color:var(--accent-secondary)}details{padding:22px 0;border-bottom:1px solid var(--border-subtle)}summary{cursor:pointer;font-weight:700;font-size:1.05rem;padding-right:12px}details p{margin:16px 0 0;color:var(--text-muted)}.faq-list{max-width:70ch}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.field{margin-bottom:18px}label{display:block;font-weight:650;margin-bottom:7px}input,textarea,select{width:100%;padding:12px 14px;color:var(--text-primary);background:var(--bg-canvas);border:1px solid var(--border-subtle);border-radius:10px}textarea{resize:vertical;min-height:150px}select option{background:var(--bg-canvas)}.preview{white-space:pre-wrap;min-height:280px;margin:0;background:var(--bg-canvas);padding:20px;border-radius:12px;font-family:ui-monospace,monospace;font-size:.9rem;line-height:1.7;color:var(--text-primary)}.status{min-height:1.7em;margin-top:14px;color:var(--accent-secondary)}.site-footer{border-top:1px solid var(--border-subtle);padding:38px 0;color:var(--text-muted);font-size:.875rem}.footer-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}.footer-links{display:flex;flex-wrap:wrap;gap:18px}.footer-note{margin:22px 0 0;max-width:76ch}.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease-kinetic),transform .8s var(--ease-kinetic)}.js .reveal-visible{opacity:1;transform:translateY(0)}.no-script-note{color:var(--accent-secondary)}
@media(min-width:1025px){.hero{min-height:580px}.page-intro h1{max-width:20ch}}
@media(min-width:769px) and (max-width:1024px){.header-inner{gap:15px;padding-inline:20px}.nav{gap:12px;font-size:.65rem}.brand{font-size:.85rem}.hero-grid{gap:25px}.hero-images{min-height:400px}.article-layout{grid-template-columns:minmax(0,1fr) 220px;gap:28px}}
@media(max-width:768px){.header-inner{min-height:78px;padding:16px 24px}.menu-toggle{display:block}.js .nav{display:none;position:absolute;top:100%;left:0;right:0;padding:18px 24px;background:var(--bg-surface);box-shadow:var(--shadow-elevation);font-size:.85rem;flex-direction:column;align-items:stretch;gap:4px}.js .nav.open{display:flex;animation:menuDrop .25s var(--ease-kinetic)}body:not(.js) .header-inner{flex-wrap:wrap}body:not(.js) .nav{width:100%;flex-wrap:wrap;gap:16px}.hero-grid,.split,.form-grid,.article-layout{grid-template-columns:1fr}.hero{padding:35px 0 55px}.hero-images{min-height:390px;max-width:500px;width:100%;margin:20px auto 0}.band{padding:52px 0}.page-intro{padding:38px 0}.article-aside{order:2}.grid{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}.form-grid{gap:28px}}
@media(min-width:481px) and (max-width:768px){.hero-images{min-height:430px}.hero h1{max-width:18ch}}
@media(max-width:480px){.wrap{width:calc(100% - 32px)}.header-inner{padding-inline:16px}.brand{font-size:.82rem}.brand-mark{width:29px;height:29px}.hero-images{min-height:320px}.timber-joint-image{height:235px}.tile-edge-image{height:190px;top:75px}.cabinet-hardware-image{height:140px}h1{font-size:2.5rem}h2{font-size:1.7rem}.card,.panel{padding:22px}.budget-line{gap:12px;padding:16px}.media-row{align-items:flex-start}.thumbnail{width:65px;height:65px}.footer-links{gap:14px}}
@keyframes menuDrop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}.card:hover,.button:hover{transform:none}}