/* Our Texas Home: the one stylesheet. Tokens first, then layout, components, pages. No build step. */
:root{--paper:#f3f0e8;--paper-2:#ebe7dc;--ink:#233b3d;--ink-2:#47585a;--teal:#296c6f;--teal-2:#1d5154;--tint:#e3eee8;--amber:#b9753d;--grey:#687370;--line:#dcdcd2;--card:#fff;
  --warn-bg:#fff7e8;--err:#a43726;--err-bg:#fff0eb;--measure:70ch;--wide:1120px;--radius:12px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
img{max-width:100%}
a{color:var(--teal);text-underline-offset:2px}a:hover{color:var(--teal-2)}
h1,h2,h3{line-height:1.2;font-weight:650;color:var(--ink)}
h1{font-size:clamp(26px,4.2vw,32px);margin:.1em 0 .3em}
h2{font-size:21px;margin:1.8em 0 .6em}
h3{font-size:17px;margin:1.2em 0 .4em}
p{margin:.5em 0}
ul{margin:.4em 0}

/* header, navigation, footer */
.top{background:var(--ink);color:#fff}
.top-inner{max-width:var(--wide);margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px}
.brand{color:#fff;font-weight:700;font-size:18px;text-decoration:none}.brand:hover{color:#fff}
.account{margin-left:auto;display:flex;gap:2px;align-items:center;font-size:14px}.account form{margin:0}
.account a,.linkbtn{color:#d9e6e2;text-decoration:none;padding:5px 8px;border-radius:6px;background:none;border:0;font:inherit;cursor:pointer}
.account a:hover,.linkbtn:hover{background:rgba(255,255,255,.12);color:#fff}
.main-nav{border-top:1px solid rgba(255,255,255,.12)}
.nav-inner{max-width:var(--wide);margin:0 auto;padding:0 8px;display:flex;overflow-x:auto;scrollbar-width:none}
.nav-inner::-webkit-scrollbar{display:none}
.nav-inner a{color:#e3ece9;text-decoration:none;padding:10px 10px 8px;white-space:nowrap;font-size:15px;border-bottom:3px solid transparent}
.nav-inner a:hover{color:#fff;background:rgba(255,255,255,.07)}
.nav-inner a.on{color:#fff;border-bottom-color:var(--amber);font-weight:600}
.brand,.account a,.linkbtn{white-space:nowrap}
@media(max-width:640px){.top-inner{padding:8px 12px 6px}.brand{font-size:17px}.account{font-size:13px}.account a,.linkbtn{padding:4px 6px}
  .nav-inner{flex-wrap:wrap;overflow:visible;padding:0 6px 4px}.nav-inner a{font-size:14px;padding:7px 8px 5px}
  .lead{font-size:16.5px}main{padding-top:18px}}
main{max-width:var(--wide);margin:0 auto;padding:24px 16px 56px}
.foot{border-top:1px solid var(--line);background:var(--paper-2)}
.foot-inner{max-width:var(--wide);margin:0 auto;padding:16px;display:flex;flex-wrap:wrap;gap:6px 20px;font-size:14px}
.foot a{color:var(--ink-2)}

/* page heading and text */
.page-head{margin:0 0 18px}
.lead{font-size:18px;line-height:1.55;color:var(--ink-2);max-width:var(--measure);margin:.2em 0 .5em}
.crumbs{font-size:14px;margin:0 0 4px;color:var(--grey)}
.kicker{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey);margin:0 0 3px;font-weight:600}
.meta,.note{color:var(--grey);font-size:14px}
.prose{max-width:var(--measure)}
.sub{color:var(--ink-2);margin:.2em 0}
.status{color:var(--ink-2);font-size:15px}
.notice{background:var(--warn-bg);border-left:4px solid var(--amber);padding:11px 16px;border-radius:4px;max-width:var(--measure)}
.status-box{background:#fff;border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:8px;padding:6px 18px;max-width:82ch;margin:0 0 8px}
.error{color:var(--err)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* buttons and tags */
.btn{display:inline-block;background:var(--teal);color:#fff;padding:8px 14px;border-radius:8px;text-decoration:none;border:1px solid var(--teal);font:inherit;font-size:15px;line-height:1.3;cursor:pointer}
.btn:hover{background:var(--teal-2);border-color:var(--teal-2);color:#fff}
.btn.ghost{background:transparent;color:var(--teal)}.btn.ghost:hover{background:var(--tint);color:var(--teal-2)}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.tag{display:inline-block;font-size:12px;line-height:1.5;padding:1px 8px;border-radius:999px;background:var(--tint);color:var(--teal);white-space:nowrap;vertical-align:1px;text-decoration:none}
.tag.old{background:#e9e8e1;color:#696b65}.tag.study{background:#eee5f2;color:#674776}.tag.warn{background:#f6e7d4;color:#865023}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chips .tag{font-size:13px;padding:3px 10px;white-space:normal;text-align:left}

/* home hero and the house's selected design */
.hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:start;margin-bottom:8px}
.hero img{display:block;width:100%;border-radius:var(--radius);border:1px solid var(--line);background:#e9e7df}
.hero h1{margin-top:0}
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:20px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin:0 0 16px}
.feature img{display:block;width:100%;border-radius:8px}
.feature h2{margin:.1em 0 .2em;font-size:22px}.feature h2 a{color:var(--ink);text-decoration:none}
@media(max-width:820px){.hero,.feature{grid-template-columns:1fr}}

/* build price line (home, the house, services, decisions) */
.cost-line{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px;margin:16px 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:6px 28px;align-items:start;max-width:960px}
.cost-line p{margin:0}
.cost-line .big{display:inline-block;font-size:34px;font-weight:750;color:var(--ink);text-decoration:none;font-variant-numeric:tabular-nums;line-height:1.15;margin:2px 0}
.cost-line .big:hover{color:var(--teal)}
.cost-addons{list-style:none;margin:0;padding:0;font-size:15px}
.cost-addons li{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;padding:6px 0;border-bottom:1px solid var(--line)}
.cost-addons li:last-child{border-bottom:0}
.cost-addons .num{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:600}
.cost-line>p.meta{grid-column:1/-1}
@media(max-width:700px){.cost-line{grid-template-columns:1fr}}

/* entries: one card per drawing, used on every page */
.entries{display:grid;gap:12px;max-width:960px}
.entry{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.entry.no-thumb{grid-template-columns:minmax(0,1fr)}
.entry .thumb img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;background:#ebe9e2}
.entry h3{margin:0 0 2px;font-size:17px}.entry h3 a{color:var(--ink);text-decoration:none}.entry h3 a:hover{color:var(--teal);text-decoration:underline}
.entry .sub{font-size:15px;margin:0 0 4px}
.entry .meta{margin:2px 0}
.entry .status{margin:6px 0 0;font-size:14px}
.entry.is-old .thumb img{opacity:.75}
.entries.compact{grid-template-columns:repeat(auto-fill,minmax(420px,1fr));max-width:none}
.entries.compact .entry{grid-template-columns:120px minmax(0,1fr);gap:12px;padding:10px}
.entries.compact .entry.no-thumb{grid-template-columns:minmax(0,1fr)}
.entries.compact .entry h3{font-size:16px}.entries.compact .entry .sub{font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:600px){.entries.compact{grid-template-columns:minmax(0,1fr)}.entry{grid-template-columns:92px minmax(0,1fr);gap:12px;padding:10px}.entry .sub,.entry .status{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}}

/* groups and subjects on the section pages */
.group{max-width:960px}
.subject{margin:0 0 14px}
.earlier{margin:6px 4px 0 14px;font-size:14px}
.earlier ul,.retired ul{margin:6px 0 0;padding-left:18px}.earlier li,.retired li{margin:0 0 8px}
details>summary{cursor:pointer;color:var(--teal)}
.jump{display:flex;flex-wrap:wrap;gap:6px 8px;margin:4px 0 0}
.jump a{font-size:14px;padding:4px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;text-decoration:none}.jump a:hover{border-color:var(--teal)}
.tier-line{margin:-.2em 0 12px}
.retired{margin-top:32px;max-width:960px}.retired-item{margin:12px 0 0 14px}
details.brief{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px 18px;margin:16px 0;max-width:960px}
details.brief[open]>summary{margin-bottom:6px}details.brief .doc{border:0;padding:0;background:none;font-size:15px}
details.quiet{margin:14px 0;font-size:15px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;max-width:960px}
@media(max-width:760px){.two-col{grid-template-columns:1fr}}
ul.plain{padding-left:18px}ul.plain li{margin:0 0 6px}
ul.plain li,.doclist li,.speclist li,.files li,.earlier li,.retired li{overflow-wrap:anywhere}

/* drawing page */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin:16px 0 8px}
.gallery figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.gallery img{display:block;width:100%;height:auto;background:#fff}
.gallery figcaption{font-size:14px;color:var(--ink-2);padding:8px 12px;border-top:1px solid var(--line)}
@media(max-width:640px){.gallery{grid-template-columns:1fr}}
.files{columns:2 260px;padding-left:18px}.files li{break-inside:avoid;overflow-wrap:anywhere}
.history{padding-left:18px}.history li{margin:0 0 4px}.history li.here>a{font-weight:700;color:var(--ink)}
.comment{background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 14px;margin:0 0 8px;max-width:82ch}
.comment-form textarea,form.note textarea{display:block;width:100%;max-width:82ch;min-height:80px;font:inherit;padding:8px;border:1px solid var(--line);border-radius:8px;margin:0 0 8px;background:#fff}

/* the folded record on a drawing page, and the record page */
details.record{background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 18px;margin:24px 0 8px;max-width:82ch;font-size:15px}
details.record[open]>summary{margin-bottom:6px}
details.record dl{margin:0 0 6px}details.record dt{font-weight:600;font-size:13px;color:var(--grey);text-transform:uppercase;letter-spacing:.04em;margin-top:10px}
details.record dd{margin:2px 0 0;color:var(--ink-2)}
.record-day{font-size:15px;color:var(--grey);margin:1.4em 0 .3em}
.record-list{padding-left:18px;max-width:82ch}.record-list li{margin:0 0 12px;overflow-wrap:anywhere}.record-list .status{margin:3px 0}
.record-list details.more{font-size:14px}

/* summaries, the brief's design text, the trades */
.summary{color:var(--ink)}
p.lead.summary{color:var(--ink);margin:14px 0 6px}
.hero .summary{font-size:17px;line-height:1.55;max-width:var(--measure)}
.entries.compact .entry .summary{-webkit-line-clamp:3}
.design-text{max-width:960px}.design-text .doc{max-width:none}
.trade-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:6px 0 12px}
.trade-chips .kicker{margin:0 4px 0 0}
.trade-chips a{font-size:14px;padding:4px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;text-decoration:none}.trade-chips a:hover{border-color:var(--teal)}
.for-trades{margin:4px 0 0}.for-trades .tag{margin-right:2px}
.trade-cards .card .blurb{font-size:14px;color:var(--ink-2);margin:4px 0 6px}
.trade-sheet{margin:0 0 22px}.trade-sheet h3{margin:1em 0 .2em}.trade-sheet .gallery{margin-top:8px}

/* documents */
.doclist{padding-left:18px}.doclist li{margin:0 0 6px}
.speclist{columns:2 300px;padding-left:18px;font-size:15px}.speclist li{break-inside:avoid;margin:0 0 4px}
.speclist details{display:inline-block;margin-left:4px;font-size:13px;vertical-align:top}.speclist details ul{padding-left:16px;margin:2px 0 6px}
.doc{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px 26px;max-width:860px;overflow-wrap:break-word}
.doc img{max-width:100%;height:auto}.doc pre{overflow-x:auto}
.doc table{display:block;overflow-x:auto;max-width:100%;border-collapse:collapse;font-size:14px}
.doc td,.doc th{border:1px solid var(--line);padding:5px 8px;vertical-align:top}
@media(max-width:600px){.doc{padding:14px 16px}}

/* cards (budget groups, comparisons, the retired design's pages) */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
a.card{text-decoration:none;color:inherit}
.card.on{border-color:var(--teal);box-shadow:0 0 0 1px var(--teal)}
.card img{width:100%;height:170px;object-fit:cover;display:block;background:#e9e7df}
.card .b{padding:12px 14px}.card .t{font-weight:600}.card .s{color:var(--grey);font-size:13px}
.card strong{display:block;font-size:20px;margin:4px 0;font-variant-numeric:tabular-nums}
.gal img{width:100%;border-radius:10px;border:1px solid var(--line);margin:10px 0;background:#fff}

/* build price */
.price-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:20px;margin:4px 0 16px;align-items:start}
.price-house{background:#fff;border:2px solid var(--teal);border-radius:var(--radius);padding:16px 20px}
.price-house .big{font-size:clamp(34px,6vw,46px);font-weight:750;line-height:1.05;margin:4px 0 10px;font-variant-numeric:tabular-nums}
.price-house .desc{font-size:15px;color:var(--ink-2)}
.price-addons .explain{margin:0 0 8px}
table.tiers{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:15px}
table.tiers th,table.tiers td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
table.tiers th{font-weight:500}table.tiers th>a{font-weight:600}
table.tiers td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600}
table.tiers tfoot th,table.tiers tfoot td{background:#f6f5f0;font-weight:600}table.tiers tfoot tr:last-child th,table.tiers tfoot tr:last-child td{border-bottom:0}
table.tiers tr.on th,table.tiers tr.on td{background:var(--tint)}
@media(max-width:820px){.price-head{grid-template-columns:1fr}}
@media(max-width:520px){table.tiers td.meta{display:none}table.tiers th,table.tiers td{padding:9px 10px}}

/* tables */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
table.sched,table.estimate{width:100%;border-collapse:collapse;font-size:14px;background:#fff}
table.sched{min-width:640px}
table.sched th,table.sched td,table.estimate th,table.estimate td{padding:7px 9px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
table.sched th.tl,table.sched td.tl{width:28%}
.ph{background:#e8ece6;font-weight:600}
.bar{position:relative;height:14px;background:#eee;border-radius:7px}.bar i{position:absolute;top:0;bottom:0;border-radius:7px;background:var(--teal)}.bar i.done{background:#7a9a7e}.bar i.blocked{background:#b24a3a}.bar i.active{background:var(--amber)}
.estimate-warning{padding:12px 18px;border-left:4px solid var(--err);background:var(--err-bg);border-radius:4px;max-width:var(--measure)}
.estimate-filter{display:flex;align-items:end;flex-wrap:wrap;gap:12px 14px;margin:16px 0}
.estimate-filter label{display:flex;flex-direction:column;font-size:14px;gap:4px}
.estimate-filter input,.estimate-filter select{font:inherit;padding:8px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);max-width:100%}
.estimate-table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:10px}
.estimate-table{width:100%;border-collapse:collapse;font-size:14px;min-width:780px}
.estimate-table th{background:#e5ede8;text-align:left}
.estimate-table td,.estimate-table th{padding:11px 12px;vertical-align:top;border-bottom:1px solid var(--line)}
.estimate-table td:first-child{width:46%}.estimate-table td:not(:first-child){font-variant-numeric:tabular-nums}
.estimate-table tr.ref{color:var(--grey)}
.estimate-table details{font-size:13px;margin-top:6px;max-width:520px}
@media(max-width:560px){.estimate-filter label,.estimate-filter select,.estimate-filter input{width:100%}}

/* sign-in and the 3D viewer */
.login{max-width:380px;margin:48px auto;background:#fff;padding:26px;border-radius:var(--radius);border:1px solid var(--line)}
.login h1{font-size:22px}.login label{display:block;font-size:14px}
.login input{width:100%;padding:9px;margin:6px 0 14px;border:1px solid #ccc;border-radius:8px;font:inherit}
model-viewer{width:100%;height:70vh;background:#dfe6ea;border-radius:var(--radius)}