/* Responsive and state rules. Printed INLINE in the head by templates/page-main.php.
   Do not move these into style.css: an optimiser that strips one declaration here breaks
   the mobile header or the FAQ accordion with no error. See README, problem 5. */

*{box-sizing:border-box}
body{margin:0;background:#ffffff;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:#14416f;text-decoration:none}
a:hover{color:#2f7a52}
summary::-webkit-details-marker{display:none}
summary::marker{content:""}
details[open] .plus{transform:rotate(45deg)}
input,select,textarea{font-family:'Public Sans',system-ui,sans-serif}
input:focus,select:focus,textarea:focus{outline:2px solid #14416f;outline-offset:1px}
.card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card:hover,.card:focus-within{transform:translateY(-3px);box-shadow:0 10px 24px rgba(20,65,111,.10);border-color:#bed0e2}
.drop{position:relative}
.drop-panel{opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .16s ease,transform .16s ease,visibility .16s}
.drop:hover .drop-panel,.drop:focus-within .drop-panel{opacity:1;visibility:visible;transform:translateY(0)}
/* Touchscreens (Surface, iPad landscape) have no hover. "Property Types" and "Tax & Process"
   are buttons, not links: a tap focuses the button, which opens the panel through :focus-within,
   and tapping elsewhere closes it. Both hub pages are listed inside their panels. No JavaScript. */
.drop-btn:focus{outline:none}
.drop-btn:focus-visible{outline:2px solid #14416f;outline-offset:4px;border-radius:6px}
.drop-btn:hover,.drop:focus-within .drop-btn{color:#14416f !important}
.navlink{transition:color .15s ease}
.navlink:hover{color:#14416f}
#nav-h{position:absolute;opacity:0;pointer-events:none}
#nav-h:checked ~ .mobile-nav{display:block !important}
@media (prefers-reduced-motion:reduce){.card,.drop-panel,.navlink{transition:none}.card:hover,.card:focus-within{transform:none}}
.g3,.g6,.g9{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.g4,.g8{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:960px){.g4,.g6,.g8{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.g3,.g9{grid-template-columns:minmax(0,1fr)}.g5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.g4,.g6,.g8{grid-template-columns:minmax(0,1fr)}}
@media (min-width:961px){.mobile-bar{display:none !important}.desk-nav{display:flex !important}}
@media (max-width:960px){.desk-nav{display:none !important}}
.state{transition:background .15s ease,color .15s ease}
.state:hover,.state:focus{background:#eef3f8;color:#14416f}
#nav-c{position:absolute;opacity:0;pointer-events:none}
#nav-c:checked ~ .mobile-nav{display:block !important}
#states-toggle{position:absolute;opacity:0;pointer-events:none}
.state-grid{display:none}
#states-toggle:checked ~ .state-grid{display:grid}
.state-label{transition:border-color .15s ease,background .15s ease}
.state-label:hover,#states-toggle:focus ~ .state-label{border-color:#14416f;background:#f3f6fa}
#states-toggle:checked ~ .state-label .chev{transform:rotate(180deg)}
@media (min-width:721px){.state-label{display:none !important}.state-grid{display:grid !important}}
@media (prefers-reduced-motion:reduce){.card,.drop-panel,.navlink,.state{transition:none}.card:hover,.card:focus-within{transform:none}}
.flip{perspective:1200px}
.flip-in{position:relative;height:100%;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.flip:hover .flip-in,.flip:focus-within .flip-in{transform:rotateY(180deg)}
.flip-f,.flip-b{-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:18px;padding:26px;min-height:278px;display:flex;flex-direction:column;justify-content:center;height:100%}
.flip-b{position:absolute;inset:0;transform:rotateY(180deg)}
.flip-in:focus-visible{outline:2px solid #14416f;outline-offset:3px;border-radius:18px}
@media (prefers-reduced-motion:reduce){.flip-in{transition:none}.flip:hover .flip-in,.flip:focus-within .flip-in{transform:none}.flip-b{position:static;transform:none;margin-top:12px}}
.tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media (max-width:960px){.tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.tabs{grid-template-columns:minmax(0,1fr)}}
.tabradio{position:absolute;opacity:0;pointer-events:none}
.panel{display:none;grid-column:1/-1;margin-top:18px}
.tablabel{transition:background .15s ease,border-color .15s ease}
.tablabel:hover{border-color:#14416f !important}
.tabradio:focus-visible + label{outline:2px solid #2f7a52;outline-offset:2px}
#tab-homes:checked + label{background:#14416f !important;color:#ffffff !important;border-color:#14416f !important}
#tab-homes:checked + label svg path{stroke:#ffffff !important}
#tab-homes:checked ~ .panel-homes{display:block}
#tab-land:checked + label{background:#14416f !important;color:#ffffff !important;border-color:#14416f !important}
#tab-land:checked + label svg path{stroke:#ffffff !important}
#tab-land:checked ~ .panel-land{display:block}
#tab-commercial:checked + label{background:#14416f !important;color:#ffffff !important;border-color:#14416f !important}
#tab-commercial:checked + label svg path{stroke:#ffffff !important}
#tab-commercial:checked ~ .panel-commercial{display:block}
#tab-lives:checked + label{background:#14416f !important;color:#ffffff !important;border-color:#14416f !important}
#tab-lives:checked + label svg path{stroke:#ffffff !important}
#tab-lives:checked ~ .panel-lives{display:block}
.tabs:not(:has(.tabradio:checked)) label[for="tab-homes"]{background:#14416f !important;color:#ffffff !important;border-color:#14416f !important}
.tabs:not(:has(.tabradio:checked)) label[for="tab-homes"] svg path{stroke:#ffffff !important}
.tabs:not(:has(.tabradio:checked)) .panel-homes{display:block}
.quotes{column-count:2;column-gap:20px}
@media (max-width:760px){.quotes{column-count:1}}

/* Hover states, lifted out of the design files. Nine in total.
   Every one has a prefers-reduced-motion opt-out through the shared .card rule above. */
.hv1:hover,.hv1:focus-visible{background:#f3f6fa;color:#14416f}
.hv2:hover,.hv2:focus-visible{border-color:#14416f;background:#f3f6fa}
.hv3:hover,.hv3:focus-visible{background:#2f7a52;color:#ffffff}
.hv4:hover,.hv4:focus-visible{background:#f3f6fa}
.hv5:hover,.hv5:focus-visible{background:#e6f2ea;color:#14416f}
.hv6:hover,.hv6:focus-visible{background:#1b5289;color:#ffffff}
.hv7:hover,.hv7:focus-visible{background:#2f7a52}
.hv8:hover,.hv8:focus-visible{background:#14416f}
.hv9:hover,.hv9:focus-visible{background:#eef3f8;border-color:#14416f}

/* Nav current page marker, set by rwc_header() from the page key. */
.navcur{background:#f3f6fa;color:#14416f !important;font-weight:600}

/* ---------------------------------------------------------------------------
   Fluent Forms skin. Inline and nooptimize on purpose: Remove Used CSS has no
   way to know these classes matter, and a stripped rule leaves a default blue
   button and half width inputs on every intake form on the site.
   --------------------------------------------------------------------------- */
.rwc-form .fluentform{margin:0}
.rwc-form .ff-el-group{margin-bottom:16px}
.rwc-form .ff-el-input--label{margin-bottom:6px;padding:0}
.rwc-form .ff-el-input--label label{font-family:'Public Sans',system-ui,sans-serif;font-size:14.5px;font-weight:600;color:#26303c;line-height:1.35;margin:0}
.rwc-form .ff-el-input--label.ff-el-is-required label:after{color:#9b2226;margin-left:3px}
.rwc-form .ff-el-form-control,.rwc-form select.ff-el-form-control{width:100%;min-height:46px;padding:11px 14px;font-family:'Public Sans',system-ui,sans-serif;font-size:16px;color:#26303c;background:#ffffff;border:1px solid #cfd8e3;border-radius:10px;box-shadow:none;line-height:1.4;transition:border-color .15s ease,box-shadow .15s ease}
.rwc-form textarea.ff-el-form-control{min-height:120px;resize:vertical}
.rwc-form .ff-el-form-control:hover{border-color:#b3c2d4}
.rwc-form .ff-el-form-control:focus{border-color:#14416f;box-shadow:0 0 0 3px rgba(20,65,111,.13);outline:none}
.rwc-form .ff-el-form-control::placeholder{color:#9aa6b4}
.rwc-form .ff-el-help-message{font-size:13.5px;color:#68737f;margin:6px 0 0;line-height:1.5}
.rwc-form .ff-el-is-error .ff-el-form-control{border-color:#9b2226}
.rwc-form .error-text,.rwc-form .text-danger{font-size:13.5px;color:#9b2226;margin-top:5px}

/* Fluent lays multi column rows out with its own grid. Give it real gaps and
   let every column collapse to full width on a narrow screen. */
.rwc-form .ff-t-container{display:flex;flex-wrap:wrap;gap:0 18px;margin:0;align-items:flex-end}
.rwc-form .ff-t-cell{padding:0;flex:1 1 220px;min-width:0}
.rwc-form .ff-t-column-2 .ff-t-cell,.rwc-form .ff-t-column-3 .ff-t-cell{flex:1 1 220px}
@media (max-width:560px){.rwc-form .ff-t-cell{flex:1 1 100%}}

/* A name field is two inputs inside one cell, so it needs twice the room of a
   single-input cell. Without this the first and last name boxes end up about
   80px wide while phone and email take a full column each. */
.rwc-form .ff-t-cell:has(.ff-name-field-wrapper){flex:2 1 360px}
.rwc-form .ff-name-field-wrapper{display:flex;flex-wrap:wrap;gap:0 18px;align-items:flex-end}
.rwc-form .ff-name-field-wrapper > div{flex:1 1 150px;min-width:0;padding:0}
@media (max-width:560px){.rwc-form .ff-name-field-wrapper > div{flex:1 1 100%;margin-bottom:16px}}

/* Labels wrap to different line counts ("Name" against "Last Name"), which used
   to push the inputs to different heights. Bottom-align every field in a row and
   let the label sit above whatever height it needs. */
.rwc-form .ff-t-cell .ff-el-group,.rwc-form .ff-name-field-wrapper > div .ff-el-group{display:flex;flex-direction:column;justify-content:flex-end;height:100%}
.rwc-form .ff-el-input--label label{line-height:1.25;display:block}

/* Buttons: the site pill, never the Fluent default blue. */
.rwc-form .ff-btn,.rwc-form .ff-btn-submit,.rwc-form .ff_btn_style{background:#14416f !important;border:none !important;color:#ffffff !important;font-family:'Public Sans',system-ui,sans-serif;font-size:16.5px !important;font-weight:600 !important;padding:14px 28px !important;border-radius:999px !important;min-height:48px;box-shadow:none !important;cursor:pointer;transition:background .15s ease}
.rwc-form .ff-btn:hover,.rwc-form .ff-btn-submit:hover,.rwc-form .ff_btn_style:hover{background:#2f7a52 !important}
.rwc-form .ff-btn:focus-visible{outline:2px solid #2f7a52;outline-offset:2px}
.rwc-form .ff_submit_btn_wrapper,.rwc-form .ff-el-group.ff-text-left{text-align:left;margin-bottom:0}
.rwc-form .step-nav{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.rwc-form .step-nav button{flex:0 0 auto}
.rwc-form .step-nav .ff-btn-prev{background:#ffffff !important;color:#14416f !important;border:1px solid #c2cfdd !important}
.rwc-form .step-nav .ff-btn-prev:hover{background:#f3f6fa !important;color:#14416f !important}

/* Multi step progress bar. */
.rwc-form .ff-step-header{margin-bottom:22px}
.rwc-form .ff-el-progress{background:#e4ebf2;border-radius:999px;height:6px;overflow:hidden}
.rwc-form .ff-el-progress-bar{background:#2f7a52;height:6px;border-radius:999px;font-size:0}
.rwc-form .ff-step-titles{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:0 0 12px;padding:0}
.rwc-form .ff-step-titles li{font-size:14px;color:#8a98a8;font-weight:500;padding:0}
.rwc-form .ff-step-titles li.active{color:#14416f;font-weight:600}

/* File upload and Turnstile. */
.rwc-form .ff-el-input--content .ff_upload_btn{background:#ffffff;border:1px dashed #c2cfdd;border-radius:10px;color:#14416f;font-weight:600;padding:14px 18px;width:100%;min-height:46px}
.rwc-form .ff-el-input--content .ff_upload_btn:hover{border-color:#14416f;background:#f3f6fa}
.rwc-form .ff-el-group.ff-el-turnstile,.rwc-form .cf-turnstile{margin-bottom:18px}
.rwc-form .ff-message-success{background:#e6f2ea;border:1px solid #bcdcc8;border-radius:12px;color:#1f5a3a;padding:18px 20px;font-size:16px}
.rwc-form .ff-errors-in-stack{background:#fdecec;border:1px solid #f2cfcf;border-radius:12px;color:#9b2226;padding:14px 18px;font-size:15px;margin-bottom:16px}