:root {
  --r-lg:20px; --r-md:12px; --ease:cubic-bezier(.2,.8,.2,1);
  --rest:0 2px 4px #3023190a,0 12px 30px #30231914;
  --lift:0 5px 9px #30231911,0 22px 42px #30231929;
}
html { overflow-x:clip }
.btn,#examples .switches button { border-radius:999px }
.btn > span[aria-hidden] { display:inline-block }
#catch .bs-exact input,#examples input,#examples select,.application input,.application textarea,.application select { border-radius:var(--r-md) }
#catch .bs-calc,#examples .scenario-panel,#fit .application { padding:clamp(18px,3vw,31px);border:0;border-radius:var(--r-lg);box-shadow:var(--rest);min-width:0 }
#catch .bs-calc,#examples .scenario-panel { background:var(--cream) }
#examples .scenario-fields fieldset { border:0;border-radius:var(--r-md);background:#efe8da }
#examples .switches button { border:1px solid transparent;background:#f4eddf }
#examples .switches button[aria-pressed=true] { background:var(--green);color:var(--cream);box-shadow:0 4px 10px #27332934 }
.photoblock .photo-frame { display:block;overflow:hidden;border-radius:var(--r-lg);box-shadow:var(--rest) }
.photoblock img { border-radius:0 }
#catch { position:relative;background:linear-gradient(135deg,var(--cream) 0%,var(--paper) 100%) }
#examples { background:radial-gradient(ellipse at 80% 10%,#dedfcf,transparent 65%),var(--paper) }
.section.statement,#fit { position:relative;isolation:isolate }
.section.statement::before,#fit::before {content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 400px 310px at var(--glow-x,50%) var(--glow-y,50%),#c3e2a821,transparent 72%);opacity:var(--glow,0) }
#commission { background:var(--paper) }
#commission .proof-flow { gap:14px;border:0;align-items:stretch;margin-top:29px }
#commission .proof-flow li,#commission .proof-flow li:first-child { border:0;border-radius:var(--r-lg);padding:17px 19px;background:var(--cream);box-shadow:var(--rest);min-width:0 }
#commission .proof-note { margin-top:24px }
#catch .bs-bar { height:18px;align-items:center;overflow:visible;background:transparent;gap:0 }
#catch .bs-bar > span { height:12px;display:block }
#catch .bs-bar > span:first-child { border-radius:999px 0 0 999px }
#catch .bs-bar > span:last-child { border-radius:0 999px 999px 0 }
#catch .bs-results > div { border-radius:8px;padding-inline:8px }
#catch[data-highlight="operator"] .bs-results > div:has(#bs-keep),#catch[data-highlight="branch"] .bs-results > div:has(#bs-earn) { background:#eae6d7 }
#catch[data-highlight="operator"] #bs-bar-operator,#catch[data-highlight="branch"] #bs-bar-branch { height:18px;border-radius:999px }
.btn:active { transform:translateY(1px) scale(.98) }
@media(min-width:921px) {
  .hero .photoblock { margin-right:-36px }
  .photoblock img {aspect-ratio:2.15;max-height:275px}
  #catch { padding-bottom:50px;z-index:2 }
  #catch .bs-calc { position:relative;margin-bottom:-94px;z-index:2 }
  .section.statement { padding-top:110px }
}
@media(min-width:691px) { #commission .proof-flow li:nth-child(2) { margin-top:8px;margin-bottom:-8px } #commission .proof-flow li:nth-child(3) { margin-top:16px;margin-bottom:-16px } #commission .proof-note{margin-top:36px} }
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .btn,#examples .switches button { transition:transform .15s var(--ease),background-color .15s,box-shadow .15s }
  .btn > span[aria-hidden] {transition:transform .18s var(--ease)}
  .btn:hover,#examples .switches button:hover,#examples .switches button[aria-pressed=true] {transform:translateY(-2px)}
  .btn:active {transform:translateY(1px) scale(.98)}
  .btn:hover > span[aria-hidden] {transform:translate(3px,-2px)}
  #examples .switches button:hover:not([aria-pressed=true]) {background:#dbdcc9}
  #commission .proof-flow li {transition:transform .25s var(--ease),box-shadow .25s var(--ease),background-color .25s,color .25s}
  #commission .proof-flow li:hover {transform:translateY(-7px) scale(1.018);box-shadow:var(--lift)}
  #commission .proof-flow:has(li:hover) li:not(:hover) {transform:scale(.98);background:#eee8da}
  .photoblock .photo-frame {transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
  .photoblock img {transition:transform .65s var(--ease)}
  .photoblock .photo-frame:hover {transform:translateY(-4px);box-shadow:var(--lift)}
  .photoblock .photo-frame:hover img {transform:scale(1.045)}
  #catch .bs-bar > span {transition:height .18s var(--ease)}
  .tilt-panel { transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .2s var(--ease),box-shadow .2s var(--ease) }
  .tilt-panel:hover:not(:focus-within) {box-shadow:var(--lift)!important}
  .tilt-panel:focus-within {transform:none;transition:none}
  .section.statement::before,#fit::before {transition:opacity .3s var(--ease)}
}
@media(prefers-reduced-motion:reduce) {.btn:active {transform:none}}

@media(min-width:1350px){.hero .photoblock{margin-right:calc(-1 * min(5vw,95px))}}