@import url('https://fonts.googleapis.com/css2?family=Albert+Sans:wght@400;500;600;700&family=Schibsted+Grotesk:wght@600;700&family=Source+Serif+4:wght@400;500&display=swap');
:root {
  --paper:#FAF6EC;
  --surface:#FAF6EC;
  --ink:#1A1810;
  --muted:#6E6650;
  --line:#D2C9AE;
  --green:#2D5A3D;
  --soft:#F5EBDD;
  color:var(--ink);
  background:var(--paper);
  font:17px/1.55 'Albert Sans',sans-serif
}
* {
  box-sizing:border-box
}
body {
  margin:0
}
button,input,select,textarea {
  font:inherit;
  color:inherit
}
button,a,input,select,textarea {
  touch-action:manipulation
}
button,a {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
button:disabled,fieldset:disabled {
  opacity:.65;
  cursor:default
}
a {
  color:var(--green)
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {
  outline:2px solid #B44E31;
  outline-offset:3px
}
button,input,select,textarea {
  min-height:48px
}
button {
  border:1px solid var(--line);
  border-radius:7px;
  background:var(--surface);
  padding:12px 20px;
  font-weight:600
}
h1,h2,h3,p {
  margin:0 0 18px
}
h1 {
  font:400 clamp(34px,4vw,48px)/1.12 'Source Serif 4',serif;
  letter-spacing:-.035em;
  max-width:650px
}
h2 {
  font:400 30px/1.2 'Source Serif 4',serif
}
h3 {
  font-size:20px;
  line-height:1.35
}
small {
  display:block;
  font-size:14px;
  color:var(--muted);
  font-weight:400
}
fieldset {
  margin:0;
  padding:0;
  border:0;
  min-width:0
}
[hidden] {
  display:none!important
}
.site-header {
  height:86px;
  max-width:1320px;
  margin:auto;
  padding:20px 32px;
  display:flex;
  align-items:center;
  gap:28px;
  border-bottom:1px solid var(--line)
}
.wordmark {
  font:700 31px 'Schibsted Grotesk',sans-serif;
  text-decoration:none;
  color:var(--ink);
  letter-spacing:-2px;
  margin-right:auto
}
.wordmark span {
  font:11px sans-serif;
  vertical-align:top;
  letter-spacing:0
}
.site-header #save-status {
  font-size:14px;
  color:var(--muted)
}
.help-link {
  font-size:15px
}
.workspace {
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  max-width:1180px;
  margin:48px auto 0;
  gap:60px;
  padding:0 32px 70px
}
aside {
  border-right:1px solid var(--line);
  padding-right:26px
}
.side-title,.eyebrow {
  text-transform:uppercase;
  letter-spacing:.09em;
  font-size:12px;
  color:var(--muted);
  display:block;
  margin-bottom:18px
}
.steps {
  display:grid;
  gap:10px
}
.steps button {
  display:flex;
  align-items:center;
  gap:12px;
  text-align:left;
  border:0;
  background:none;
  padding:12px 8px;
  font-size:15px
}
.steps button.active {
  background:#e6ebdf;
  color:var(--green)
}
.step-number {
  width:25px;
  height:25px;
  border:1px solid var(--line);
  border-radius:50%;
  display:grid;
  place-content:center;
  font-size:12px;
  flex-shrink:0
}
.side-help {
  margin-top:72px;
  font-size:14px;
  color:var(--muted)
}
.side-help strong {
  color:var(--ink)
}
.main-task {
  min-width:0;
  max-width:740px
}
.intro {
  color:var(--muted);
  font-size:18px;
  margin-bottom:32px
}
.field {
  display:flex;
  flex-direction:column;
  gap:10px;
  font-weight:600;
  font-size:16px;
  margin:0 0 24px
}
input,select,textarea {
  width:100%;
  border:1px solid #b8aa91;
  border-radius:6px;
  background:var(--surface);
  padding:12px 14px;
  font-weight:500;
  max-width:100%
}
textarea {
  resize:vertical
}
input[type=checkbox],input[type=radio] {
  width:21px;
  min-height:21px;
  height:21px;
  flex-shrink:0;
  accent-color:var(--green)
}
.fineprint {
  font-size:14px;
  color:var(--muted);
  margin:8px 0 24px
}
.knowledge-review {
  margin-top:38px
}
.knowledge-card {
  border:1px solid var(--line);
  border-radius:7px;
  background:var(--surface);
  margin-top:18px;
  overflow:hidden
}
.knowledge-card-header,.knowledge-body {
  padding:24px
}
.knowledge-body {
  border-top:1px solid var(--line)
}
.current-setting {
  background:var(--soft);
  padding:14px 16px;
  margin:18px 0;
  border-radius:4px
}
.current-setting span {
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--muted)
}
.current-setting p {
  margin:8px 0 0
}
.configure-button {
  display:flex;
  justify-content:space-between;
  width:100%;
  background:var(--green);
  color:var(--paper);
  border-color:var(--green);
  text-align:left
}
.service-price-row {
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:6px;
  padding:22px;
  margin:0 0 22px
}
.service-row-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:22px;
  gap:10px;
  color:var(--muted);
  font-size:14px
}
.service-price-fields {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(135px,1fr));
  gap:16px;
  margin-bottom:22px
}
.service-price-fields .field {
  margin-bottom:0
}
.service-price-row>.field:last-child {
  margin-bottom:0
}
.service-subheading {
  margin-top:30px;
  padding-top:28px;
  border-top:1px solid var(--line);
  margin-bottom:26px
}
.primary,.secondary,.back {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border-radius:28px;
  padding:13px 22px;
  min-height:50px;
  font-weight:600
}
.primary {
  background:var(--green);
  color:var(--paper);
  border:1px solid var(--green)
}
.secondary,.back {
  border:1px solid var(--green);
  color:var(--green);
  background:var(--surface)
}
.text-button {
  background:none;
  border:0;
  color:var(--green);
  padding:8px 0;
  text-decoration:underline;
  text-underline-offset:4px
}
.hours-day {
  display:grid;
  grid-template-columns:90px repeat(3,minmax(0,1fr));
  align-items:end;
  gap:14px;
  padding:18px 0;
  border-bottom:1px solid var(--line)
}
.hours-day>strong {
  align-self:center
}
.hours-day .field {
  min-width:0;
  font-size:12px;
  margin:0;
  gap:6px
}
.hours-day-note {
  grid-column:span 2;
  align-self:center;
  font-size:14px;
  color:var(--muted)
}
.weekly-hours {
  margin-bottom:20px
}
details {
  margin-bottom:24px
}
summary {
  cursor:pointer;
  min-height:44px;
  padding:8px 0;
  color:var(--green);
  font-weight:600
}
.customer-preview {
  margin:24px 0;
  background:var(--soft);
  padding:14px 20px;
  border-radius:6px
}
.reply-preview {
  margin-top:18px
}
.tone-choices {
  display:flex;
  gap:10px;
  flex-wrap:wrap
}
.tone-choices button[aria-pressed=true] {
  color:var(--paper);
  background:var(--green);
  border-color:var(--green)
}
.plan-choice {
  display:flex;
  gap:14px;
  align-items:start;
  border:1px solid var(--line);
  padding:20px;
  border-radius:6px;
  margin-bottom:14px;
  background:var(--surface);
  cursor:pointer
}
.plan-choice.selected {
  border:2px solid var(--green);
  padding:19px
}
.plan-price {
  margin-left:auto;
  font-weight:600;
  white-space:nowrap
}
.choice {
  display:flex;
  gap:12px;
  margin:26px 0;
  align-items:start;
  font-size:15px
}
.notice,.provisioning-panel,.phone-handoff {
  background:var(--soft);
  padding:22px;
  border-radius:6px;
  margin-bottom:26px
}
.connection-banner {
  border:1px solid var(--line);
  border-radius:6px;
  padding:14px 18px;
  margin-bottom:26px
}
.routing-steps {
  padding-left:23px
}
.routing-steps li {
  padding:0 0 20px 7px
}
.readiness-list {
  padding-left:20px
}
.step-actions {
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  justify-content:space-between;
  border-top:1px solid var(--line);
  padding-top:26px;
  margin-top:34px
}
.action-progress {
  width:100%;
  font-size:12px;
  color:var(--muted)
}
.mobile-progress {
  display:none
}
#validation:not(:empty) {
  border-left:3px solid #aa4c2d;
  background:#f8e9df;
  padding:16px;
  margin-bottom:24px
}
.save-recovery {
  padding:18px 32px;
  background:#f8e9df
}
.save-recovery button {
  margin-right:10px
}
.start-error {
  max-width:700px;
  margin:80px auto;
  padding:24px
}
.loading {
  padding:60px;
  text-align:center
}
@media(max-width:760px) {
  .site-header {
    padding:16px 20px;
    height:76px;
    gap:12px
  }
  .wordmark {
    font-size:27px
  }
  .site-header #save-status {
    font-size:12px;
    max-width:110px
  }
  .help-link {
    font-size:13px
  }
  .workspace {
    display:block;
    padding:0 20px 190px;
    margin:24px auto 0
  }
  aside {
    display:none
  }
  .mobile-progress {
    display:flex;
    margin-bottom:30px;
    font-size:12px
  }
  .mobile-progress select {
    font-size:16px
  }
  .main-task {
    max-width:600px;
    margin:auto
  }
  h1 {
    font-size:35px
  }
  .intro {
    font-size:17px
  }
  .knowledge-card-header,.knowledge-body {
    padding:18px
  }
  .service-price-row {
    padding:18px
  }
  .service-price-fields {
    grid-template-columns:1fr;
    gap:20px;
    margin-bottom:24px
  }
  .hours-day {
    grid-template-columns:1fr 1fr;
    gap:14px;
    padding:22px 0
  }
  .hours-day>strong {
    grid-column:1
  }
  .hours-day-note {
    grid-column:1/-1
  }
  .hours-day .field {
    font-size:13px
  }
  .plan-choice {
    flex-wrap:wrap;
    gap:10px
  }
  .plan-choice>span:nth-child(2) {
    flex:1;
    min-width:160px
  }
  .plan-price {
    width:100%;
    margin-left:31px
  }
  .step-actions {
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    background:var(--surface);
    padding:12px 20px calc(14px + env(safe-area-inset-bottom));
    margin:0;
    gap:8px;
    z-index:10;
    box-shadow:0 -4px 16px #24241d08
  }
  .step-actions .back {
    padding:10px 14px;
    font-size:13px
  }
  .step-actions .primary {
    padding:12px 16px;
    font-size:14px;
    flex:1;
    min-width:160px
  }
  .action-progress {
    font-size:11px
  }
  .tone-choices button {
    flex:1;
    padding:10px
  }
  .service-row-heading .text-button {
    font-size:12px
  }
  .save-recovery {
    padding:16px 20px
  }
  .notice,.provisioning-panel,.phone-handoff {
    padding:18px
  }
}

.verification-panel {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--bone, #d2c9ae);
}
.verification-code { margin-top: 24px; }
.verification-code input { max-width: 240px; letter-spacing: .2em; }
.side-help small { display: block; margin-top: 8px; line-height: 1.5; }
.resume-tools { margin-top: 32px; }
.resume-tools small { display: block; color: var(--ink-muted, #6e6650); line-height: 1.5; }

/* Native iOS time controls must shrink within their grid track. */
.hours-day input[type="time"] {
  min-width:0;
  width:100%;
  max-width:100%;
  min-height:48px;
  font-size:16px;
  box-sizing:border-box;
}
.hours-day input[type="time"]::-webkit-date-and-time-value { min-width:0; text-align:left; }
@media (max-width:700px) {
  .hours-day { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hours-day .field:has(input[type="time"]) { grid-column:1/-1; }
}

.forwarding-code { display:block; overflow-wrap:anywhere; margin:20px 0; padding:16px; border:1px solid var(--line); border-radius:6px; background:var(--surface); font-size:clamp(18px,5vw,24px); letter-spacing:.02em; user-select:all; }
.forwarding-guide h3 { margin-top:28px; }
.forwarding-guide .routing-steps li { margin-bottom:18px; }
.copy-feedback:empty { display:none; }

.finish-summary { padding:28px; border-radius:8px; background:var(--soft); margin-bottom:28px; }
.finish-summary h2 { margin-top:8px; }
.finish-checks { list-style:none; padding:0; margin:24px 0; }
.finish-checks li { display:flex; gap:12px; margin:14px 0; align-items:baseline; }
.finish-marker { flex:0 0 22px; color:var(--muted); }
.finish-marker.confirmed { color:var(--green); font-weight:700; }
.finish-test { margin:28px 0; border:1px solid var(--line); border-radius:8px; padding:24px; }
.finish-test summary { font-weight:700; color:var(--green); cursor:pointer; min-height:48px; }
.finish-test-actions { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.finish-guide,.finish-prompts { margin-top:36px; }
.finish-next { padding-left:24px; }
.finish-next li { padding-left:8px; margin:24px 0; }
.finish-next p { margin:8px 0; }
.finish-prompts blockquote { margin:20px 0; padding:16px 20px; border-left:3px solid var(--green); background:var(--soft); }
.finish-links { display:flex; flex-wrap:wrap; gap:24px; margin-top:32px; }
.finish-links a { display:inline-flex; align-items:center; min-height:48px; }
@media (max-width:700px) {
  .finish-summary,.finish-test { padding:20px; }
  .finish-test-actions { align-items:stretch; flex-direction:column; }
}

.entry-choices { display:flex; flex-wrap:wrap; gap:16px; margin:24px 0; }
@media(max-width:600px) { .entry-choices { flex-direction:column; } .entry-choices button { width:100%; } }

/* Plain-language setup: one question, a clear answer, and room to read. */
.main-task { max-width:680px; }
.question-progress { color:var(--muted); font-size:13px; margin-bottom:24px; }
.optional-settings { margin:24px 0; border-top:1px solid var(--line); padding-top:12px; }
.optional-settings>div { padding-top:16px; }
.setup-review { margin-bottom:40px; }
.review-row { padding:22px 0; border-bottom:1px solid var(--line); }
.review-row h3 { font-size:16px; margin-bottom:10px; }
.review-row p { margin-bottom:10px; overflow-wrap:anywhere; }
.review-services { list-style:none; padding:0; margin:0 0 16px; }
.review-services li { margin:12px 0; overflow-wrap:anywhere; }
.review-hours { list-style:none; padding:0; margin:0; }
.review-hours li { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin:6px 0; }
.review-hours strong { font-weight:500; }
.setup-help-actions { display:flex; justify-content:space-between; gap:20px; margin-top:20px; }
.setup-help-actions a { min-height:48px; display:inline-flex; align-items:center; }
.primary:hover:not(:disabled) { background:#244730; }
.main-task .tone-choices { margin-bottom:28px; }
.main-task { animation:question-arrive .2s ease-out; }
@keyframes question-arrive { from { opacity:.6; transform:translateY(5px); } to { opacity:1; transform:none; } }
@media(max-width:760px) {
  .workspace { padding-bottom:40px; }
  .step-actions { position:static; padding:24px 0 0; margin-top:30px; box-shadow:none; background:none; }
  .step-actions .primary { order:1; flex-basis:100%; }
  .step-actions .back { order:2; border:0; padding-left:0; justify-content:flex-start; }
  .step-actions .action-progress { order:0; }
  .setup-help-actions { margin-top:4px; padding-bottom:env(safe-area-inset-bottom); }
  .plan-price { white-space:normal; overflow-wrap:anywhere; margin-left:0; }
  .service-price-row { padding:16px; }
  .connection-banner { padding:14px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
.shared-hours { margin-bottom:24px; }
.day-choices { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.day-choices button { min-width:48px; padding:10px 12px; }
.day-choices button[aria-pressed=true] { background:var(--green); color:var(--paper); border-color:var(--green); }
.shared-hours-times { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.shared-hours-times .field,.shared-hours-times input { min-width:0; }
.hours-summary { padding:18px; background:var(--soft); border-radius:6px; margin-bottom:18px; }
.arrival { padding:24px; border:1px solid var(--line); border-radius:8px; margin-bottom:28px; background:var(--paper); animation:question-arrive .35s ease-out; }
.arrival-bridge { height:3px; background:var(--line); position:relative; overflow:hidden; margin:24px 0; }
.arrival-bridge::after { content:''; position:absolute; inset:0; background:var(--green); transform:translateX(-100%); animation:arrival-pass 1.2s ease-in-out 2; }
@keyframes arrival-pass { to { transform:translateX(100%); } }
@media(prefers-reduced-motion:reduce) { .arrival,.arrival-bridge::after { animation:none!important; } .arrival-bridge::after { transform:none; } }

/* Keep native iOS time controls inside their grid cells. */
.shared-hours-times input[type=time],.hours-day input[type=time] {
  width:100%; min-width:0; max-width:100%; min-inline-size:0;
  box-sizing:border-box; -webkit-appearance:none; appearance:none;
  padding:12px 8px;
}
input[type=time]::-webkit-date-and-time-value { min-width:0; text-align:left; }
input[type=time]::-webkit-datetime-edit { min-width:0; padding:0; }
.plan-wrap { position:relative; }
.plan-wrap .plan-choice { padding-right:58px; }
.plan-info { position:absolute; right:12px; top:14px; width:44px; height:44px; padding:0; border-radius:50%; font-weight:700; }
#lead-definition { width:min(520px,calc(100% - 32px)); max-height:85dvh; overflow:auto; padding:24px; color:var(--ink); background:var(--paper); border:1px solid var(--line); border-radius:12px; }
#lead-definition::backdrop { background:rgba(26,24,16,.55); }
#lead-definition h2 { font-size:28px; line-height:1.2; margin-top:0; }
#lead-definition p { margin:18px 0; }
.forwarding-priority { margin-top:0; padding:20px; border:2px solid var(--green); }
.forwarding-priority h2 { font-size:26px; margin:0 0 16px; }
.forwarding-priority p { margin-bottom:16px; }
.forwarding-priority .secondary { width:100%; }
