:root { --ink:#17221f; --moss:#3f5f55; --paper:#f3f0e7; --sand:#dfd6c4; --lime:#d4ef7c; --orange:#ff784a; --muted:#61706a; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; font-family:Manrope, sans-serif; background:var(--paper); color:var(--ink); } button,input,textarea { font:inherit; } button { cursor:pointer; } .site-header { height:82px; padding:0 clamp(24px,5vw,80px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #d9d4c8; } .wordmark { color:var(--ink); text-decoration:none; font-weight:800; letter-spacing:-.06em; font-size:1.5rem; } .wordmark span { color:var(--orange); margin-right:4px; } .header-cta { color:var(--ink); text-decoration:none; font-size:.88rem; font-weight:700; } .header-cta span { color:var(--orange); margin-left:6px; }
.hero { padding:clamp(72px,10vw,150px) clamp(24px,9vw,144px) 110px; background:var(--paper); } .eyebrow,.section-label { font-family:"DM Mono", monospace; text-transform:uppercase; letter-spacing:.05em; font-size:.68rem; } .eyebrow { color:var(--moss); margin:0 0 34px; } .hero-grid { display:grid; grid-template-columns:minmax(0,1fr) 255px; gap:50px; align-items:end; } h1 { font-size:clamp(3.8rem,8vw,8rem); letter-spacing:-.075em; line-height:.87; margin:0; max-width:800px; } h1 em { color:var(--moss); font-style:normal; } .hero-copy { max-width:470px; font-size:1.05rem; line-height:1.65; margin:38px 0 30px; color:#44524c; } .hero-actions { display:flex; align-items:center; gap:26px; } .button { border:0; padding:15px 21px; border-radius:100px; text-decoration:none; font-size:.87rem; font-weight:800; display:inline-flex; align-items:center; gap:25px; } .button-dark { background:var(--ink); color:white; } .button-light { background:var(--lime); color:var(--ink); } .text-button { border:0; background:transparent; color:var(--ink); text-decoration:underline; font-weight:700; padding:0; } .text-button span { color:var(--orange); }
.availability-card { background:var(--moss); color:white; padding:25px; min-height:228px; display:flex; flex-direction:column; border-radius:2px; }.availability-card p { margin:0 0 25px; font-size:.75rem; opacity:.72; }.status-dot,.online-dot { display:inline-block; width:9px; height:9px; border-radius:99px; background:var(--lime); }.availability-card strong { font-size:1.18rem; letter-spacing:-.04em; line-height:1.18; }.availability-note { margin-top:auto; color:#cfdbd4; font-size:.69rem; line-height:1.5; }
.services { padding:42px clamp(24px,9vw,144px) 122px; background:#e8e1d1; }.section-label { color:#596760; display:flex; gap:16px; padding-bottom:28px; border-bottom:1px solid #bdb6a8; }.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:35px; padding-top:36px; }.service-grid article>span { font-family:"DM Mono",monospace; color:var(--orange); font-size:.8rem; }.service-grid h2 { font-size:1.58rem; letter-spacing:-.055em; margin:50px 0 12px; }.service-grid p { color:#53605a; max-width:280px; font-size:.9rem; line-height:1.65; margin:0; }
.contact-strip { background:var(--orange); color:var(--ink); padding:100px clamp(24px,9vw,144px); }.contact-strip p { font-family:"DM Mono",monospace; font-size:.7rem; text-transform:uppercase; margin:0 0 20px; }.contact-strip h2 { font-size:clamp(3rem,6.5vw,6rem); letter-spacing:-.07em; line-height:.9; margin:0 0 38px; }.contact-strip .button { background:var(--ink); color:white; } footer { background:var(--ink); color:#c8d2cc; padding:23px clamp(24px,9vw,144px); font: .66rem "DM Mono", monospace; }
.chat-launcher { position:fixed; right:25px; bottom:25px; z-index:3; border:0; border-radius:99px; color:var(--ink); background:var(--lime); padding:14px 18px; font-weight:800; box-shadow:0 9px 25px #17221f33; }.launcher-spark { margin-right:8px; }.chat-panel { display:none; position:fixed; right:25px; bottom:82px; z-index:4; width:min(385px,calc(100vw - 32px)); min-height:490px; background:#fffdfa; border-radius:14px; box-shadow:0 20px 60px #17221f3d; overflow:hidden; flex-direction:column; }.chat-panel.open { display:flex; }.chat-panel__header { background:var(--ink); color:#fff; padding:20px; display:flex; justify-content:space-between; }.chat-panel__header strong,.chat-panel__header small { display:block; }.chat-panel__header strong { font-size:.88rem; margin-left:16px; margin-top:-12px; }.chat-panel__header small { color:#becbc4; font-size:.68rem; margin:4px 0 0 16px; }.icon-button,.modal-close { border:0; background:transparent; color:inherit; font-size:1.7rem; line-height:1; }.chat-messages { flex:1; padding:20px; display:flex; gap:10px; flex-direction:column; overflow:auto; max-height:310px; }.message { font-size:.83rem; line-height:1.5; padding:11px 13px; border-radius:12px; max-width:88%; }.assistant { background:#edf0eb; align-self:flex-start; }.user { background:var(--moss); color:white; align-self:flex-end; }.quick-replies { display:flex; flex-wrap:wrap; gap:6px; padding:0 20px 14px; }.quick-replies button { border:1px solid #ccd4ce; background:#fff; border-radius:99px; padding:7px 9px; font-size:.68rem; color:var(--moss); }.chat-form { display:flex; gap:8px; padding:14px 16px; border-top:1px solid #e5e4df; }.chat-form input { min-width:0; flex:1; border:0; outline:0; }.chat-form button { width:32px; height:32px; border-radius:99px; border:0; background:var(--lime); }.chat-disclaimer { margin:0; padding:0 16px 13px; color:#76817b; font-size:.59rem; }.lead-modal { display:none; position:fixed; inset:0; z-index:6; padding:20px; background:#17221fb8; align-items:center; justify-content:center; }.lead-modal.open { display:flex; }.lead-modal__card { position:relative; width:min(500px,100%); padding:35px; background:var(--paper); }.modal-close { position:absolute; right:18px; top:16px; color:var(--ink); }.lead-modal h2 { margin:0; font-size:2.35rem; letter-spacing:-.06em; }.modal-copy { color:var(--muted); font-size:.88rem; line-height:1.6; }.lead-form { display:grid; gap:15px; margin-top:25px; }.lead-form label { font-size:.75rem; font-weight:800; }.lead-form input,.lead-form textarea,.lead-form select { display:block; width:100%; border:1px solid #c8c8bf; background:#fffdfa; padding:10px; margin-top:7px; outline-color:var(--moss); border-radius:2px; font-family:Manrope,sans-serif; font-size:.85rem; }.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
@media (max-width:700px) { .hero { padding-bottom:72px; }.hero-grid,.service-grid { grid-template-columns:1fr; }.availability-card { min-height:180px; max-width:none; }.hero-actions { flex-wrap:wrap; }.services { padding-bottom:74px; }.service-grid h2 { margin-top:24px; } }