:root {
  --desk-navy: #071f38;
  --desk-deep: #041525;
  --desk-blue: #1769c7;
  --desk-ice: #eaf4ff;
  --desk-paper: #f4f6f8;
  --desk-line: #e1e7ed;
  --desk-muted: #697786;
  --desk-green: #148463;
  --desk-amber: #a66111;
}

[hidden] { display: none !important; }

/* Customer booking experience */
.booking-shell { width: min(1210px, calc(100% - 40px)); grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); }
.booking-side { padding: clamp(48px, 5vw, 70px); }
.booking-side h1 { max-width: 470px; }
.booking-side .quote-intro { max-width: 410px; }
.booking-expectations { display: grid; gap: 22px; margin: 42px 0 0; padding: 0; list-style: none; }
.booking-expectations li { display: grid; grid-template-columns: 34px 1fr; gap: 14px; }
.booking-expectations li > span { padding-top: 1px; color: #72b7f8; font-size: .75rem; font-weight: 900; letter-spacing: .06em; }
.booking-expectations strong { color: #fff; font-size: .9rem; }
.booking-expectations p { margin: 3px 0 0; color: rgba(255,255,255,.67); font-size: .83rem; line-height: 1.5; }
.booking-side-contact { display: grid; gap: 3px; margin: 41px 0 0; padding: 23px 0 0; border-top: 1px solid rgba(255,255,255,.16); }
.booking-side-contact > span { color: rgba(255,255,255,.67); font-size: .77rem; }
.booking-side-contact > a { color: #fff; font-size: 1.35rem; font-weight: 800; letter-spacing: -.025em; }
.booking-side-contact p { margin: 0; color: #8bc3f5; font-size: .77rem; }
.booking-side .quote-alt { margin-top: 28px; padding-top: 21px; }
.booking-form-wrap { min-height: 760px; padding: clamp(42px, 5vw, 66px); }
.booking-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; max-width: 580px; margin: 0 auto 40px; }
.booking-progress-item { display: flex; flex-direction: column; gap: 5px; padding-bottom: 14px; border-bottom: 2px solid #e2e8ee; color: #82909e; }
.booking-progress-item span { font-size: .68rem; font-weight: 900; letter-spacing: .1em; }
.booking-progress-item strong { font-size: .77rem; }
.booking-progress-item.is-active { border-color: var(--desk-blue); color: var(--desk-navy); }
.booking-progress-item.is-complete { border-color: #a4ccee; color: #45739b; }
.booking-form { max-width: 580px; gap: 18px; }
.booking-honeypot { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0 !important; pointer-events: none !important; }
.booking-step { display: grid; gap: 17px; }
.booking-step-label { margin: 0; color: var(--desk-blue); font-size: .72rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.booking-step h2, .booking-success h2 { margin: -5px 0 0; color: var(--desk-navy); font-size: clamp(1.9rem, 2.7vw, 2.5rem); line-height: 1.05; letter-spacing: -.035em; }
.booking-step-intro { margin: -7px 0 3px; color: var(--desk-muted); font-size: .89rem; line-height: 1.64; }
.booking-category-fieldset { margin: 0; padding: 0; border: 0; }
.booking-category-list { display: grid; gap: 10px; }
.booking-category-option { position: relative; display: block !important; cursor: pointer; }
.booking-category-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.booking-category-content { display: grid; grid-template-columns: 31px 1fr 20px; align-items: center; gap: 12px; min-height: 81px; padding: 13px 14px; border: 1px solid #d5dee6; background: #fff; color: #29465f; transition: border-color .16s ease, background .16s ease; }
.booking-category-content > span:nth-child(2) { display: grid; gap: 4px; }
.booking-category-content strong { color: #14314b; font-size: .84rem; font-weight: 800; letter-spacing: 0; text-transform: none; }
.booking-category-content small { color: #748290; font-size: .73rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.booking-category-check { display: grid; place-items: center; width: 19px; height: 19px; border: 1px solid #c5d1dc; border-radius: 50%; color: transparent; font-size: .7rem; }
.booking-category-option input:focus-visible + .booking-category-content { outline: 3px solid rgba(23,105,199,.18); }
.booking-category-option input:checked + .booking-category-content { border-color: var(--desk-blue); background: #f2f8fd; }
.booking-category-option input:checked + .booking-category-content .booking-category-check { border-color: var(--desk-blue); background: var(--desk-blue); color: #fff; }
.booking-service-label { margin-top: 4px; }
.booking-price-note { min-height: 19px; margin: -9px 0 0; color: #607589; font-size: .76rem; line-height: 1.5; }
.booking-optional { color: #7b8793; font-size: .62rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.booking-upload { display: grid; gap: 8px; margin-top: 1px; }
.booking-upload-label { display: flex !important; align-items: center; gap: 12px !important; padding: 14px 15px; border: 1px dashed #b9cad9; background: #f8fafb; color: #476781 !important; cursor: pointer; }
.booking-upload-label > span { display: grid; gap: 3px; }
.booking-upload-label strong { color: #15344e; font-size: .77rem; letter-spacing: 0; text-transform: none; }
.booking-upload-label small { color: #758392; font-size: .69rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.booking-upload input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.booking-upload.uploads-unavailable .booking-upload-label { opacity: .55; cursor: default; }
.booking-photo-previews { display: flex; flex-wrap: wrap; gap: 9px; }
.booking-photo-preview { position: relative; width: 66px; height: 66px; }
.booking-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.booking-photo-preview button { position: absolute; top: -7px; right: -7px; display: grid; place-items: center; width: 22px; height: 22px; border: 0; border-radius: 50%; background: var(--desk-navy); color: #fff; font-size: 17px; cursor: pointer; }
.booking-upload-message { margin: 0; color: #697786; font-size: .72rem; line-height: 1.5; }
.booking-step-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 4px; }
.booking-back { padding: 10px 0; border: 0; background: transparent; color: #526a7e; font-size: .79rem; font-weight: 800; cursor: pointer; }
.booking-next, .booking-submit { cursor: pointer; }
.booking-summary { display: grid; gap: 3px; padding: 16px; border-left: 3px solid var(--desk-blue); background: #f4f8fb; }
.booking-summary > span { color: #6c7b88; font-size: .7rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.booking-summary strong { color: var(--desk-navy); font-size: .88rem; }
.booking-summary p { margin: 0; color: #667482; font-size: .76rem; }
.booking-submit-note { margin: -4px 0 0; color: #6a7886; font-size: .72rem; line-height: 1.55; }
.booking-form-error { padding: 12px 14px; border-left: 3px solid #bc3737; background: #fff4f3; color: #8c3030; font-size: .8rem; line-height: 1.6; }
.booking-success { display: grid; align-content: center; gap: 18px; min-height: 560px; }
.booking-success-check { display: grid; place-items: center; width: 53px; height: 53px; border-radius: 50%; background: #e5f5ee; color: var(--desk-green); font-size: 1.7rem; }
.booking-success > p:not(.booking-step-label) { margin: 0; color: #617180; font-size: .93rem; line-height: 1.75; }
.booking-reference { display: grid; gap: 5px; padding: 16px; border: 1px solid #dce5ed; background: #f7fafc; }
.booking-reference span { color: #6c7b87; font-size: .73rem; }
.booking-reference strong { color: var(--desk-navy); font-size: 1.12rem; letter-spacing: .07em; }
.booking-success-actions { display: grid; justify-items: start; gap: 13px; padding-top: 5px; }
.booking-success-actions > a:last-child { color: #1764b1; font-size: .79rem; font-weight: 800; }

/* Owner dashboard */
.desk-body, .desk-body * { box-sizing: border-box; }
.desk-body { margin: 0; background: var(--desk-paper); color: var(--desk-navy); font-family: Inter, Arial, Helvetica, sans-serif; line-height: 1.5; }
.desk-body a { color: inherit; text-decoration: none; }
.desk-body button, .desk-body input, .desk-body select, .desk-body textarea { font: inherit; }
.desk-body .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.desk-login { display: grid; grid-template-columns: minmax(380px, .92fr) minmax(0, 1.08fr); min-height: 100vh; background: #fff; }
.desk-login-panel { align-self: center; width: min(440px, calc(100% - 90px)); margin: 0 auto; padding: 46px 0; }
.desk-login-brand { display: inline-flex; align-items: center; justify-content: center; width: 142px; height: 96px; margin-bottom: 49px; background: var(--desk-deep); }
.desk-login-brand img { width: 118px; height: 86px; object-fit: contain; }
.desk-kicker { margin: 0 0 8px; color: var(--desk-blue); font-size: .7rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.desk-login-panel h1, .desk-page-heading h1 { margin: 0; color: var(--desk-navy); font-size: clamp(2.2rem, 4vw, 3.2rem); line-height: 1.04; letter-spacing: -.055em; }
.desk-login-intro { max-width: 380px; margin: 14px 0 31px; color: #657383; font-size: .91rem; line-height: 1.75; }
.desk-login-form { display: grid; gap: 17px; }
.desk-login-form label, .desk-job-form label { display: grid; gap: 8px; color: #17334d; font-size: .72rem; font-weight: 850; }
.desk-login-form input, .desk-search input, .desk-job-form input, .desk-job-form select, .desk-job-form textarea { width: 100%; min-height: 46px; padding: 12px 13px; border: 1px solid #d3dde5; border-radius: 0; background: #fff; color: var(--desk-navy); }
.desk-login-form input:focus, .desk-search input:focus, .desk-job-form input:focus, .desk-job-form select:focus, .desk-job-form textarea:focus { outline: 3px solid rgba(23,105,199,.15); border-color: var(--desk-blue); }
.desk-primary-button { min-height: 48px; padding: 0 17px; border: 1px solid var(--desk-navy); background: var(--desk-navy); color: #fff; font-size: .78rem; font-weight: 850; cursor: pointer; }
.desk-primary-button:hover { background: #0d345b; }
.desk-primary-button:disabled { cursor: wait; opacity: .65; }
.desk-return-link { display: inline-block; margin-top: 34px; color: #5c7185 !important; font-size: .78rem; }
.desk-login-image { position: relative; overflow: hidden; background: var(--desk-deep); }
.desk-login-image > img { width: 100%; height: 100%; min-height: 100vh; object-fit: cover; object-position: 56% center; }
.desk-login-image::after { position: absolute; inset: 0; content: ''; background: linear-gradient(0deg, rgba(3,17,32,.91), transparent 59%); }
.desk-login-image > div { position: absolute; right: 54px; bottom: 58px; left: 54px; z-index: 1; display: grid; gap: 12px; color: #fff; }
.desk-login-image > div span { color: #abd5f7; font-size: .74rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.desk-login-image > div strong { max-width: 480px; font-size: clamp(1.8rem, 3vw, 3rem); line-height: 1.1; letter-spacing: -.045em; }
.desk-error { margin: 0; padding: 11px 12px; border-left: 3px solid #be3939; background: #fff2f2; color: #8d3030; font-size: .78rem; }
.desk-topbar { position: sticky; top: 0; z-index: 10; display: grid; grid-template-columns: 102px minmax(0, 1fr) auto; align-items: center; min-height: 78px; padding: 0 clamp(20px, 4vw, 66px); background: var(--desk-deep); color: #fff; }
.desk-wordmark { display: grid; place-items: center; width: 82px; height: 74px; }
.desk-wordmark img { width: 78px; height: 70px; object-fit: contain; }
.desk-topbar-copy { display: grid; gap: 2px; }
.desk-topbar-copy strong { font-size: .87rem; }
.desk-topbar-copy span { color: #9bb2c7; font-size: .7rem; }
.desk-topbar-actions { display: flex; align-items: center; gap: 18px; }
.desk-text-button { padding: 8px 0; border: 0; background: none; color: #e8eff5 !important; font-size: .75rem; font-weight: 750; cursor: pointer; }
.desk-layout { display: grid; grid-template-columns: minmax(580px, 1fr) 430px; max-width: 1540px; min-height: calc(100vh - 78px); margin: 0 auto; }
.desk-overview { padding: 42px clamp(28px, 4vw, 66px) 70px; }
.desk-page-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 30px; }
.desk-page-heading h1 { font-size: clamp(1.8rem, 3vw, 2.5rem); }
.desk-refresh-button { min-height: 37px; padding: 0 12px; border: 1px solid #d3dce4; background: #fff; color: #304b63; font-size: .73rem; font-weight: 750; cursor: pointer; }
.desk-stats { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 29px; border: 1px solid var(--desk-line); background: #fff; }
.desk-stats article { display: grid; gap: 8px; min-height: 91px; padding: 16px 13px; border-right: 1px solid var(--desk-line); }
.desk-stats article:last-child { border-right: 0; }
.desk-stats article > span { color: #718090; font-size: .67rem; }
.desk-stats article > strong { color: var(--desk-navy); font-size: 1.55rem; line-height: 1; letter-spacing: -.04em; }
.desk-toolbar { display: grid; gap: 14px; margin-bottom: 13px; }
.desk-search input { background: #fff; font-size: .82rem; }
.desk-filter-list { display: flex; flex-wrap: wrap; gap: 7px; }
.desk-filter-list button { min-height: 31px; padding: 0 10px; border: 1px solid #dce3e9; background: #fff; color: #5a6977; font-size: .68rem; cursor: pointer; }
.desk-filter-list button.is-active { border-color: var(--desk-navy); background: var(--desk-navy); color: #fff; }
.desk-request-list { min-height: 200px; border: 1px solid var(--desk-line); background: #fff; }
.desk-request-row { display: grid; grid-template-columns: 90px minmax(0, 1fr) 103px; align-items: center; gap: 12px; width: 100%; min-height: 91px; padding: 13px 14px; border: 0; border-bottom: 1px solid #e8edf1; background: #fff; text-align: left; cursor: pointer; }
.desk-request-row:last-child { border-bottom: 0; }
.desk-request-row:hover, .desk-request-row.is-selected { background: #f2f7fc; }
.desk-request-category { width: max-content; max-width: 88px; padding: 5px 6px; background: #edf3f8; color: #49647b; font-size: .61rem; font-weight: 750; }
.desk-category-marine { background: #e9f3fc; color: #246294; }
.desk-category-rv-specialty { background: #f3ede7; color: #796146; }
.desk-request-main { display: grid; gap: 4px; min-width: 0; }
.desk-request-main strong { overflow: hidden; color: var(--desk-navy); font-size: .83rem; text-overflow: ellipsis; white-space: nowrap; }
.desk-request-main > span { overflow: hidden; color: #687583; font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.desk-request-meta { display: grid; justify-items: end; gap: 8px; }
.desk-request-meta small { color: #788593; font-size: .67rem; }
.desk-status { display: inline-flex; align-items: center; min-height: 23px; padding: 0 7px; background: #edf1f5; color: #596a7a; font-size: .63rem; font-weight: 800; white-space: nowrap; }
.desk-status-new { background: #e7f2fd; color: #1c62a9; }
.desk-status-contacted { background: #f1edf8; color: #69569a; }
.desk-status-quoted { background: #fbf1df; color: var(--desk-amber); }
.desk-status-scheduled { background: #e4f5eb; color: #19744e; }
.desk-status-completed { background: #e9edf0; color: #475963; }
.desk-loading, .desk-detail-loading, .desk-empty-list { display: grid; place-content: center; min-height: 190px; padding: 30px; color: #6b7987; text-align: center; }
.desk-empty-list > span { color: #1b3853; font-size: .9rem; font-weight: 800; }
.desk-empty-list p { max-width: 380px; margin: 7px auto 0; color: #6d7b89; font-size: .76rem; line-height: 1.65; }
.desk-dashboard-error { margin-top: 15px; }
.desk-detail { min-height: calc(100vh - 78px); padding: 31px 25px 70px; border-left: 1px solid var(--desk-line); background: #fff; }
.desk-detail-empty { display: grid; place-content: center; min-height: 480px; text-align: center; }
.desk-detail-empty > span { color: #86a4be; font-size: 1.8rem; }
.desk-detail-empty h2 { margin: 7px 0; color: var(--desk-navy); font-size: 1.12rem; }
.desk-detail-empty p { max-width: 250px; margin: 0; color: #6e7c88; font-size: .76rem; line-height: 1.7; }
.desk-detail-heading { position: relative; }
.desk-detail-heading h2 { margin: 12px 0 3px; color: var(--desk-navy); font-size: 1.75rem; line-height: 1.08; letter-spacing: -.045em; }
.desk-detail-heading > p { margin: 0; color: #758391; font-size: .7rem; }
.desk-detail-close { position: absolute; top: -6px; right: -3px; display: none; width: 33px; height: 33px; border: 0; background: #eef2f5; color: #30495f; font-size: 23px; cursor: pointer; }
.desk-contact-actions { display: flex; gap: 9px; padding: 19px 0 22px; }
.desk-contact-actions a { display: inline-grid; place-items: center; min-width: 70px; min-height: 35px; padding: 0 10px; border: 1px solid #ccd8e2; color: #234760; font-size: .73rem; font-weight: 800; }
.desk-contact-actions a:nth-child(2) { border-color: var(--desk-navy); background: var(--desk-navy); color: #fff; }
.desk-detail-section { display: grid; gap: 14px; padding: 21px 0; border-top: 1px solid #e4e9ee; }
.desk-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.desk-section-heading h3 { margin: 0; color: #17334c; font-size: .82rem; }
.desk-section-heading > span { color: #738291; font-size: .67rem; }
.desk-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 11px; margin: 0; }
.desk-detail-grid div { min-width: 0; }
.desk-detail-grid dt { color: #718090; font-size: .67rem; }
.desk-detail-grid dd { margin: 3px 0 0; overflow-wrap: anywhere; color: #17324a; font-size: .74rem; font-weight: 720; }
.desk-project-note { padding: 11px 12px; background: #f4f7f9; }
.desk-project-note > span { color: #687787; font-size: .66rem; font-weight: 800; }
.desk-project-note p { margin: 6px 0 0; color: #334b61; font-size: .73rem; line-height: 1.65; white-space: pre-wrap; }
.desk-photo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.desk-photo-grid a { aspect-ratio: 1.32; background: #edf1f4; }
.desk-photo-grid img { width: 100%; height: 100%; object-fit: cover; }
.desk-job-form .desk-detail-section { gap: 13px; }
.desk-job-form label > span { color: #738290; font-size: .64rem; font-weight: 500; }
.desk-job-form textarea { min-height: 93px; resize: vertical; }
.desk-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.desk-inline-button { justify-self: start; margin-top: -5px; padding: 4px 0; border: 0; background: none; color: var(--desk-blue); font-size: .71rem; font-weight: 800; cursor: pointer; }
.desk-save-message { min-height: 17px; margin: -3px 0 0; color: var(--desk-green); font-size: .73rem; }
.desk-save-message.is-error { color: #a53434; }
.desk-timeline > div:not(.desk-section-heading) { display: grid; gap: 3px; padding-left: 11px; border-left: 2px solid #d8e4ed; }
.desk-timeline > div > span { color: #304a60; font-size: .72rem; }
.desk-timeline > div > small { color: #7c8894; font-size: .64rem; }

@media (max-width: 1160px) {
  .desk-layout { grid-template-columns: minmax(510px, 1fr) 385px; }
  .desk-overview { padding-right: 27px; padding-left: 27px; }
  .desk-detail { padding-right: 20px; padding-left: 20px; }
  .desk-request-row { grid-template-columns: 76px minmax(0, 1fr) 96px; gap: 8px; padding-right: 10px; padding-left: 10px; }
}

@media (max-width: 900px) {
  .desk-layout { display: block; }
  .desk-overview { max-width: 800px; margin: 0 auto; }
  .desk-detail { position: fixed; top: 78px; right: 0; bottom: 0; z-index: 8; width: min(430px, 100%); min-height: auto; overflow-y: auto; box-shadow: -18px 0 50px rgba(4,21,37,.13); transform: translateX(102%); transition: transform .22s ease; }
  .desk-detail.has-selection { transform: translateX(0); }
  .desk-detail-close { display: grid; place-items: center; }
  .desk-login { grid-template-columns: 1fr; }
  .desk-login-panel { width: min(445px, calc(100% - 48px)); }
  .desk-login-image { display: none; }
}

@media (max-width: 860px) {
  .booking-shell { grid-template-columns: 1fr; width: min(calc(100% - 28px), 720px); }
  .booking-side { padding: 38px 26px; }
  .booking-side h1 { max-width: 500px; }
  .booking-expectations { grid-template-columns: 1fr; gap: 14px; margin-top: 27px; }
  .booking-side-contact { margin-top: 24px; }
  .booking-form-wrap { min-height: 620px; padding: 38px 27px 50px; }
  .booking-progress { margin-bottom: 31px; }
}

@media (max-width: 580px) {
  .booking-progress { gap: 9px; }
  .booking-progress-item strong { font-size: .69rem; }
  .booking-form-wrap { min-height: 600px; padding: 32px 18px 43px; }
  .booking-category-content { gap: 9px; min-height: 74px; padding: 11px; }
  .booking-category-content small { font-size: .68rem; }
  .booking-step-actions { align-items: stretch; flex-direction: column-reverse; }
  .booking-step-actions .button, .booking-step > .button { width: 100%; }
  .booking-back { align-self: flex-start; }
  .desk-topbar { grid-template-columns: 67px minmax(0, 1fr) auto; min-height: 70px; padding: 0 12px; }
  .desk-wordmark { width: 60px; height: 65px; }
  .desk-wordmark img { width: 58px; height: 61px; }
  .desk-topbar-copy span { font-size: .6rem; }
  .desk-topbar-actions { gap: 11px; }
  .desk-topbar-actions a { display: none; }
  .desk-overview { padding: 30px 14px 55px; }
  .desk-page-heading h1 { font-size: 1.72rem; }
  .desk-stats { grid-template-columns: repeat(2, 1fr); }
  .desk-stats article:nth-child(2) { border-right: 0; }
  .desk-stats article:nth-child(-n+2) { border-bottom: 1px solid var(--desk-line); }
  .desk-request-row { grid-template-columns: minmax(0, 1fr) 94px; gap: 5px 8px; min-height: 88px; }
  .desk-request-category { grid-column: 1 / 2; grid-row: 1; }
  .desk-request-main { grid-column: 1 / 2; grid-row: 2; }
  .desk-request-meta { grid-column: 2; grid-row: 1 / 3; }
  .desk-detail { top: 70px; }
}

@media (prefers-reduced-motion: reduce) {
  .booking-category-content, .desk-detail { transition: none; }
}