/* ============================================================
   Cochran & Chhabra — shared UI: the CTA standard + the native consult form
   /assets/css/cc-ui-20260909.css  ·  pairs with /assets/js/consult-20260909.js
   Loaded after every page's inline styles, so these rules win on equal
   specificity. /assets/* is cached immutable — edits ship under a NEW filename.
   ============================================================ */

/* ---------- 1. THE CTA STANDARD ----------
   One typographic family for every button on the site, desktop and mobile:
   Inter · 12.5px · 600 · .13em tracking · ALL CAPS · 50px tall · 2px corners.
   Colour follows context (blue fill = primary action, forest fill = call,
   ghost on dark), but the shape and type never change. */
body .btn-primary,body .btn-dark,body .btn-ghost,body .ct-btn-gold,body .ct-btn-ghost,body .phone-cta,body .ccall-col .phone-cta,body .footer-cta-inner .btn-gold,body .fn-form button,body .cc-sub-form button,body .cc-sub-form .cc-sub-btn,body .cc-consult .cf-btn,body #nav .nf-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  box-sizing:border-box;min-height:50px;padding:0 1.5rem;margin-top:0;
  font-family:'Inter',system-ui,sans-serif;font-size:.78rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;line-height:1;
  text-decoration:none;border-radius:2px;border-width:1px;border-style:solid;
  cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;transition:background .2s ease,border-color .2s ease,color .2s ease,filter .2s ease;
}
body .phone-cta svg,body .btn-primary svg,body .btn-dark svg{width:16px;height:16px;flex:none;}
/* fills that some pages left borderless get a matching border so heights line up */
body .footer-cta-inner .btn-gold,body .fn-form button,body .cc-sub-form button{border-color:var(--gold,#A9BAC0);}
body .phone-cta,body .ccall-col .phone-cta{border-color:var(--forest,#102217);border-radius:2px;}
body .ct-btn-gold{border-color:var(--gold,#A9BAC0);color:var(--forest,#102217);}
body .ct-btn-ghost{font-weight:600;}
/* the primary blue fill — hover is one step lighter, never a brightness filter */
body .ct-btn-gold:hover,body .footer-cta-inner .btn-gold:hover,body .fn-form button:hover,body .cc-sub-form button:hover,body .cc-consult .cf-btn:hover{background:#c2cfd3;border-color:#c2cfd3;filter:none;}
/* sticky mobile bar keeps its full-bleed two-cell layout, but speaks the same type */
body .mobile-cta-bar a{font-size:.78rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;line-height:1.25;}
/* where a button sits in a column on phones, it goes full width */
@media (max-width:560px){
  body .ct-actions .ct-btn-gold,body .ct-actions .ct-btn-ghost,body .consult-left .phone-cta,body .ccall-col .phone-cta,body .footer-cta-inner .btn-gold{width:100%;}
  body .ct-actions{flex-direction:column;gap:10px;}
}

/* ---------- 2. THE CONSULT FORM (native, posts to HubSpot form 1789c600) ----------
   Replaces the HubSpot iframe embed, which ignored every site style: grey boxes,
   red asterisks, a title-case blue-grey button, and a 238px-wide form inside a
   full-width card on phones. Same six fields, same HubSpot destination. */
.cc-form{padding:1.7rem 1.8rem 1.6rem;}
.cc-form .cc-consult{margin:0;}
.cc-consult .cf-row{display:grid;grid-template-columns:1fr;gap:0 1rem;}
.cc-consult .cf-2{grid-template-columns:1fr 1fr;}
.cc-consult .cf-field{display:block;margin:0 0 .95rem;}
.cc-consult .cf-lab{display:block;font-family:'Inter',system-ui,sans-serif;font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--smokey,#7E8E9B);margin:0 0 .3rem;line-height:1.3;}
.cc-consult .cf-lab .req{color:var(--gold,#A9BAC0);margin-left:3px;}
.cc-consult input,.cc-consult select,.cc-consult textarea{
  display:block;width:100%;box-sizing:border-box;margin:0;
  background:transparent;border:0;border-bottom:1px solid var(--hairline,#e6e2d9);border-radius:0;
  padding:.5rem 0 .6rem;min-height:42px;
  font-family:'Inter',system-ui,sans-serif;font-size:16px;font-weight:300;color:var(--forest,#102217);line-height:1.35;
  -webkit-appearance:none;appearance:none;box-shadow:none;
}
.cc-consult input::placeholder,.cc-consult textarea::placeholder{color:var(--muted,#aaa79e);}
.cc-consult input:focus,.cc-consult select:focus,.cc-consult textarea:focus{outline:none;border-bottom-color:var(--gold,#A9BAC0);box-shadow:0 1px 0 0 var(--gold,#A9BAC0);}
.cc-consult textarea{resize:vertical;min-height:72px;}
.cc-consult .cf-select{position:relative;}
.cc-consult .cf-select::after{content:"";position:absolute;right:4px;bottom:1.05rem;width:.5em;height:.5em;border-right:1.5px solid var(--smokey,#7E8E9B);border-bottom:1.5px solid var(--smokey,#7E8E9B);transform:rotate(45deg);pointer-events:none;}
.cc-consult select{padding-right:1.4rem;cursor:pointer;}
.cc-consult select:invalid,.cc-consult select option[value=""]{color:var(--muted,#aaa79e);}
.cc-consult select option{color:var(--forest,#102217);}
.cc-consult .cf-field.is-bad input,.cc-consult .cf-field.is-bad select,.cc-consult .cf-field.is-bad textarea{border-bottom-color:#9a3b34;}
.cc-consult .cf-field.is-bad .cf-lab{color:#9a3b34;}
.cc-consult .cf-btn{width:100%;margin-top:.35rem;background:var(--gold,#A9BAC0);color:var(--forest,#102217);border-color:var(--gold,#A9BAC0);}
.cc-consult .cf-btn[disabled]{opacity:.6;cursor:default;}
.cc-consult .cf-err{margin:.7rem 0 0;font-size:.78rem;line-height:1.5;color:#9a3b34;}
.cc-consult .cf-err a{color:inherit;}
.cc-consult .cf-fine{margin:.8rem 0 0;font-size:.7rem;font-weight:300;line-height:1.5;color:var(--muted,#aaa79e);text-align:center;}
.cc-consult .cf-done{display:flex;gap:.9rem;align-items:flex-start;padding:.4rem 0 .2rem;}
.cc-consult .cf-done .ck{flex:none;width:36px;height:36px;border-radius:50%;border:1px solid var(--gold,#A9BAC0);display:flex;align-items:center;justify-content:center;color:var(--forest,#102217);}
.cc-consult .cf-done .ck svg{width:16px;height:16px;}
.cc-consult .cf-done h3{margin:0 0 .3rem;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:1.5rem;line-height:1.15;color:var(--forest,#102217);}
.cc-consult .cf-done p{margin:0;font-size:.88rem;font-weight:300;line-height:1.55;color:var(--body,#3a3a3a);}
.cc-consult .cf-done a{color:var(--forest,#102217);}
.cc-consult [hidden]{display:none!important;}
.cc-form .cc-consult + .fineprint,.cc-form .cc-consult + .embed-note{margin-top:1rem;font-size:.72rem;line-height:1.5;color:var(--muted,#aaa79e);text-align:center;font-style:normal;}
@media (max-width:560px){
  .cc-form{padding:1.25rem 1.1rem 1.2rem;}
  .cc-consult .cf-2{grid-template-columns:1fr;}
  .cc-consult .cf-field{margin-bottom:.8rem;}
}
