/* Hauser Interiors — Heritage British Craft (Direction 01) — core system
   Shared tokens + primitives + chrome. Load before page-level <style>. */
:root{--forest:#1F3A2D;--forest-deep:#16291F;--brass:#B8895A;--brass-soft:#C9A076;--ivory:#F2EBDD;--ivory-warm:#ECE3D1;--paper:#FAF6EC;--ink:#161513;--rule:rgba(31,58,45,0.14);--rule-soft:rgba(31,58,45,0.08);--muted:#5A5A55;--sage:#5C6B5D;--claret:#6E1E1E;--shell:1480px;--serif:'Cormorant Garamond','Times New Roman',serif;--sans:'Plus Jakarta Sans',system-ui,sans-serif}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased;line-height:1.55}
a{color:var(--forest);text-decoration:none}
a:hover{color:var(--brass)}
img{display:block;max-width:100%}

/* type primitives */
.serif{font-family:var(--serif);font-weight:400;letter-spacing:-0.2px}
.serif-it{font-family:var(--serif);font-style:italic;font-weight:300}
.eyebrow{font-family:var(--sans);font-weight:500;font-size:10.5px;letter-spacing:4px;text-transform:uppercase;color:var(--brass)}
.micro{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.rule{height:1px;background:var(--rule);border:0;margin:0}
.brass-rule{width:56px;height:1px;background:var(--brass);display:inline-block}
.num{font-family:var(--serif);font-style:italic;color:var(--brass);letter-spacing:0}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 26px;font-size:11.5px;letter-spacing:3px;text-transform:uppercase;text-decoration:none;border:1px solid var(--forest);border-radius:0;transition:background .18s ease,color .18s ease;font-family:var(--sans);font-weight:500;cursor:pointer;background:transparent;color:var(--forest)}
.btn:hover{background:var(--forest);color:var(--ivory)}
.btn.primary{background:var(--forest);color:var(--ivory)}
.btn.primary:hover{background:var(--forest-deep);color:var(--ivory)}
.btn.ghost-light{border-color:var(--ivory);color:var(--ivory)}
.btn.ghost-light:hover{background:var(--ivory);color:var(--forest)}
.btn.block{width:100%}
.btn.lg{padding:19px 32px;font-size:12px}
.btn.sm{padding:10px 16px;font-size:10px;letter-spacing:2.5px}
.btn:disabled,.btn[aria-disabled=true]{opacity:.4;cursor:not-allowed;background:transparent;color:var(--forest)}
.btn .arrow{font-family:serif;font-style:italic;font-size:14px;letter-spacing:0;transform:translateY(-1px)}
.link-under{border-bottom:1px solid var(--rule);padding-bottom:1px;font-size:12px;letter-spacing:1.5px;text-transform:uppercase}
.link-under:hover{border-bottom-color:var(--brass)}

/* forms */
.field{display:flex;flex-direction:column;gap:7px}
.field > label{font-size:10.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{font-family:var(--sans);font-size:14px;color:var(--ink);background:#fff;border:1px solid var(--rule);border-radius:0;padding:14px 15px;min-height:50px;transition:border-color .15s,box-shadow .15s;width:100%}
.field input::placeholder{color:#A6A29A}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--forest);box-shadow:0 0 0 3px rgba(31,58,45,0.07)}
.field.is-error input{border-color:var(--claret)}
.field .err{font-size:11.5px;color:var(--claret)}
.field .hint{font-size:11.5px;color:var(--muted)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.check{display:flex;gap:11px;align-items:flex-start;font-size:13px;color:var(--muted);cursor:pointer}
.check input{appearance:none;width:17px;height:17px;flex:0 0 17px;margin-top:2px;border:1px solid var(--rule);background:#fff;display:grid;place-items:center;cursor:pointer}
.check input:checked{background:var(--forest);border-color:var(--forest)}
.check input:checked::after{content:'';width:8px;height:4px;border-left:1.5px solid var(--ivory);border-bottom:1.5px solid var(--ivory);transform:rotate(-45deg) translateY(-1px)}

/* selectable tile (size / base / delivery slot / payment) */
.tile{position:relative;display:flex;align-items:center;gap:14px;padding:16px 18px;background:#fff;border:1px solid var(--rule);cursor:pointer;transition:border-color .15s,background .15s;text-align:left;font-family:var(--sans);min-height:56px}
.tile:hover{border-color:var(--brass)}
.tile.is-active{border-color:var(--forest);background:var(--ivory);box-shadow:inset 0 0 0 1px var(--forest)}
.tile .t-name{font-size:13.5px;font-weight:500;color:var(--forest)}
.tile .t-sub{font-size:12px;color:var(--muted)}
.tile .t-price{margin-left:auto;font-family:var(--serif);font-size:17px;color:var(--forest)}

/* panels */
.panel{background:#fff;border:1px solid var(--rule)}
.panel-pad{padding:28px 30px}
.panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:20px 30px;border-bottom:1px solid var(--rule)}
.panel-head h3{font-family:var(--serif);font-weight:500;font-size:20px;letter-spacing:.5px;margin:0;color:var(--forest)}
.badge{font-size:9.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--brass);border:1px solid rgba(184,137,90,.4);padding:4px 9px}

/* chrome: promo */
.promo{background:var(--forest);color:var(--ivory);font-size:11px;letter-spacing:3px;text-transform:uppercase;padding:11px 24px;display:flex;justify-content:center;align-items:center;gap:28px;font-weight:400}
.promo .dot{color:var(--brass)}
.promo strong{color:var(--brass);font-weight:500;letter-spacing:3px}

/* chrome: header */
.header{background:var(--ivory);border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:50}
.header-inner{max-width:var(--shell);margin:0 auto;padding:18px 40px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px}
.util-left,.util-right{display:flex;gap:22px;font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--forest)}
.util-right{justify-content:flex-end}
.util-left a,.util-right a{text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.util-icon{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.5}
.basket-count{font-family:var(--serif);font-style:italic;font-size:14px;letter-spacing:0;color:var(--brass);margin-left:2px}
.brand-block{display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none;color:var(--forest)}
.brand-block .h{font-family:var(--serif);font-weight:400;font-size:30px;letter-spacing:5px;line-height:1;text-transform:uppercase}
.brand-block .sub{font-size:9px;letter-spacing:5px;text-transform:uppercase;color:var(--brass)}
.mainnav{background:var(--ivory);border-bottom:1px solid var(--rule)}
.mainnav-inner{max-width:var(--shell);margin:0 auto;padding:14px 40px;display:flex;justify-content:center;gap:44px}
.mainnav a{font-family:var(--serif);font-weight:500;font-size:14px;letter-spacing:3px;text-transform:uppercase;color:var(--forest);text-decoration:none;padding:4px 2px;border-bottom:1px solid transparent;transition:border-color .15s}
.mainnav a:hover,.mainnav a.is-active{border-bottom-color:var(--brass);color:var(--forest)}
.mainnav a .new{font-family:var(--sans);font-size:8px;color:var(--brass);margin-left:4px;letter-spacing:1.5px;vertical-align:super}
.burger{display:none;background:none;border:0;padding:6px;cursor:pointer;color:var(--forest)}
.burger svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.5}

/* breadcrumb + page head */
.crumbs{max-width:var(--shell);margin:0 auto;padding:18px 40px 0;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--brass)}
.crumbs .sep{color:var(--brass)}
.page-head{max-width:var(--shell);margin:0 auto;padding:26px 40px 30px}
.page-head h1{font-family:var(--serif);font-weight:400;font-size:52px;line-height:1.05;letter-spacing:-0.5px;margin:10px 0 0;color:var(--forest)}
.page-head h1 em{font-style:italic;font-weight:300;color:var(--brass)}

/* trust strip */
.trust{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--ivory)}
.trust-inner{max-width:var(--shell);margin:0 auto;padding:22px 40px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.trust-item{display:flex;gap:12px;align-items:flex-start}
.trust-item svg{width:20px;height:20px;stroke:var(--brass);fill:none;stroke-width:1.3;flex:0 0 20px;margin-top:2px}
.trust-item b{display:block;font-family:var(--serif);font-size:15px;font-weight:500;color:var(--forest);letter-spacing:.3px}
.trust-item span{font-size:12px;color:var(--muted)}

/* chrome: footer */
footer.site-footer{background:var(--forest);color:var(--ivory);padding:96px 40px 32px}
.footer-inner{max-width:var(--shell);margin:0 auto}
.footer-top{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:48px;padding-bottom:56px;border-bottom:1px solid rgba(184,137,90,0.25)}
.footer-brand{display:flex;flex-direction:column;gap:18px}
.footer-brand .seal{width:96px;height:96px}
.footer-brand .ft-wordmark{font-family:var(--serif);font-weight:400;font-size:38px;letter-spacing:4px;text-transform:uppercase;line-height:1;margin:0}
.footer-brand .ft-tag{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--brass)}
.footer-brand p{color:rgba(242,235,221,0.6);font-size:13px;line-height:1.7;max-width:340px;margin:0}
.footer-col h5{font-family:var(--serif);font-weight:500;font-size:13px;letter-spacing:3px;text-transform:uppercase;color:var(--brass);margin:0 0 18px}
.footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.footer-col a{text-decoration:none;color:rgba(242,235,221,0.78);font-size:13px;transition:color .15s}
.footer-col a:hover{color:var(--brass)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:24px;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:rgba(242,235,221,0.45)}
.footer-bottom .fb-r{display:flex;gap:22px}
.footer-bottom .fb-r a{color:inherit;text-decoration:none}
.pay-row{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}
.pay{background:rgba(242,235,221,0.08);border:1px solid rgba(242,235,221,0.15);font-size:8.5px;letter-spacing:1.5px;padding:5px 8px;color:rgba(242,235,221,0.7)}

/* product thumb placeholder (bed scene) */
.bedthumb{position:relative;background:linear-gradient(170deg,var(--ivory-warm) 0%,#DDD2BC 100%);overflow:hidden}
.bedthumb .base{position:absolute;left:12%;right:12%;bottom:14%;height:26%;background:#3F3225}
.bedthumb .mattress{position:absolute;left:17%;right:17%;bottom:36%;height:13%;background:#F2EBDD}
.bedthumb .hb{position:absolute;left:20%;right:20%;bottom:47%;height:32%;border-radius:7px 7px 0 0;background:var(--tc,#5C6B5D);box-shadow:inset 0 0 40px rgba(0,0,0,.25)}

@media (max-width:1080px){
  .footer-top{grid-template-columns:1fr 1fr;gap:36px}
  .trust-inner{grid-template-columns:1fr 1fr;gap:20px}
}
@media (max-width:860px){
  .promo{gap:0;font-size:10px;letter-spacing:2px}
  .promo span:not(:first-child){display:none}
  .header-inner{grid-template-columns:auto 1fr auto;padding:14px 18px;gap:14px}
  .util-left a:not(:first-child),.util-right a:not(:last-child){display:none}
  .brand-block{align-items:flex-start}
  .brand-block .h{font-size:23px;letter-spacing:4px}
  .burger{display:block}
  .mainnav{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .mainnav-inner{justify-content:flex-start;padding:12px 18px;gap:26px;white-space:nowrap}
  .crumbs,.page-head{padding-left:18px;padding-right:18px}
  .page-head h1{font-size:34px}
  .field-row{grid-template-columns:1fr}
  footer.site-footer{padding:56px 18px 24px}
  .footer-top{grid-template-columns:1fr;gap:30px;padding-bottom:34px}
  .footer-bottom{flex-direction:column;gap:14px;align-items:flex-start}
}