/* Services page layout, cards, contact form, responsive behavior and card motion.
 * Rule order is intentional: later responsive refinements preserve the approved design.
 */
#o965-final {
  color: #0a2030;
  font-family: Arial, sans-serif;
}

#o965-final * {
  box-sizing: border-box;
}

#o965-final button{
  font: inherit;
}

#o965-final button,
#o965-final a {
  touch-action: manipulation;
}

#o965-final .canvas {
  container-type: inline-size;
  max-width: none;
  margin: auto;
  background: #f7f6f2;
}

#o965-final .canvas.phone {
  max-width: 390px;
}

#o965-final .canvas.tablet {
  max-width: 768px;
}

#o965-final .wrap {
  padding-left: 6%;
  padding-right: 6%;
}

#o965-final header {
  background: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 12px;
  padding-bottom: 12px;
  position: relative;
  z-index: 5;
}

#o965-final .logo {
  width: 68px;
  height: 68px;
  object-fit: contain;
}

#o965-final header nav {
  display: flex;
  gap: 25px;
  align-items: center;
}

#o965-final a {
  color: inherit;
  text-decoration: none;
}

#o965-final header nav a {
  font-size: 13px;
  padding: 12px 0;
}

#o965-final header nav .active {
  border-bottom: 2px solid #ff6508;
}

#o965-final .cta {
  border: 0;
  background: #0a2030;
  color: white;
  padding: 17px 22px;
  font-size: 13px;
  display: inline-flex;
  gap: 18px;
  align-items: center;
}

#o965-final .cta span {
  transition: transform 0.2s;
}

#o965-final .cta:hover span {
  transform: translate(3px, -3px);
}

#o965-final .menu {
  display: none;
  background: none;
  border: 0;
  font-size: 25px;
  padding: 10px;
}

#o965-final .hero {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 30px;
  align-items: center;
  padding-top: 64px;
  padding-bottom: 55px;
}

#o965-final .eyebrow {
  font-size: 11px;
  letter-spacing: 2.3px;
  text-transform: uppercase;
  margin: 0 0 22px;
}

#o965-final h1,
#o965-final h2,
#o965-final h3 {
  font-family: Georgia, serif;
  font-weight: 400;
}

#o965-final h1 {
  font-size: clamp(43px, 5.5cqw, 78px);
  line-height: 1.05;
  letter-spacing: -2px;
  margin: 0 0 24px;
}

#o965-final h1 em {
  font-weight: 400;
  color: #af4813;
}

#o965-final p {
  font-size: 14px;
  line-height: 1.75;
}

#o965-final .intro {
  color: #52616a;
  max-width: 450px;
  margin: 0 0 26px;
}

#o965-final .art {
  position: relative;
  height: 330px;
  isolation: isolate;
}

#o965-final .sun {
  width: 225px;
  height: 225px;
  border-radius: 50%;
  background: #f0e9dd;
  position: absolute;
  left: 22%;
  top: 45px;
  z-index: -1;
}

#o965-final .shop {
  position: absolute;
  bottom: 40px;
  left: 23%;
  width: 55%;
  height: 169px;
  background: #0c293e;
  border-radius: 65px 65px 3px 3px;
  box-shadow: 0 14px 0 -10px #d9d2c6;
}

#o965-final .shopname {
  color: #fff;
  text-align: center;
  letter-spacing: 3px;
  font-size: 11px;
  padding: 22px 0 15px;
}

#o965-final .awning {
  height: 31px;
  width: 110%;
  margin-left: -5%;
  background: repeating-linear-gradient(
    90deg,
    #ff6508 0,
    #ff6508 22px,
    #ffe4c7 22px,
    #ffe4c7 44px
  );
  border-radius: 5px 5px 12px 12px;
  transform: skewX(-4deg);
}

#o965-final .window {
  position: absolute;
  left: 12%;
  bottom: 19px;
  width: 40%;
  height: 57px;
  background: #f7f6f2;
  border: 5px solid #355063;
}

#o965-final .door {
  position: absolute;
  right: 13%;
  bottom: 0;
  width: 25%;
  height: 76px;
  background: #f7f6f2;
  border: 5px solid #355063;
  border-bottom: 0;
}

#o965-final .door:after {
  content: "";
  position: absolute;
  right: 4px;
  top: 35px;
  width: 4px;
  height: 4px;
  background: #ff6508;
  border-radius: 50%;
}

#o965-final .float {
  position: absolute;
  background: white;
  box-shadow: 0 9px 30px #0a203012;
  border: 1px solid #e5dfd5;
  border-radius: 6px;
  padding: 13px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
}

#o965-final .search {
  left: 2%;
  top: 35px;
}

#o965-final .post {
  right: 0;
  top: 104px;
  transform: rotate(7deg);
  width: 70px;
  height: 81px;
  background: #ffebe0;
  color: #a84109;
  justify-content: center;
}

#o965-final .appointment {
  right: 0;
  bottom: 9px;
}

#o965-final .tick {
  background: #0a2030;
  color: white;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
}

#o965-final .art.play .shop {
  animation: o-rise 0.8s both;
}

#o965-final .art.play .search {
  animation: o-slide 0.7s 0.7s both;
}

#o965-final .art.play .post {
  animation: o-slide 0.7s 1.4s both;
}

#o965-final .art.play .appointment {
  animation: o-slide 0.7s 2.1s both;
}

@keyframes o-rise {
  from {
    opacity: 0;
    transform: translateY(22px) scale(0.93);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes o-slide {
  from {
    opacity: 0;
    translate: 0 18px;
  }

  to {
    opacity: 1;
    translate: 0 0;
  }
}

#o965-final .art-caption {
  text-align: center;
  font:
    italic 15px Georgia,
    serif;
  margin: 8px 0;
}

#o965-final .replay {
  display: block;
  margin: 12px auto 0;
  background: none;
  border: 0;
  border-bottom: 1px solid #b7b7ae;
  color: #52616a;
  font-size: 11px;
  padding: 7px;
}

#o965-final .services {
  padding-top: 45px;
  padding-bottom: 65px;
  border-top: 1px solid #deded5;
}

#o965-final .sectionheading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 15px;
  margin-bottom: 30px;
}

#o965-final h2 {
  font-size: clamp(32px, 4cqw, 46px);
  letter-spacing: -1px;
  line-height: 1.15;
  margin: 0 0 20px;
}

#o965-final .sectionheading small {
  font-size: 11px;
  letter-spacing: 1px;
  color: #52616a;
}

#o965-final .servicegrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0 30px;
}



















#o965-final .new {
  display: inline-block;
  background: #ff6508;
  color: #0a2030;
  font: 10px Arial;
  padding: 4px 6px;
  vertical-align: middle;
  letter-spacing: 1px;
}

#o965-final .handoff {
  background: #eae9e2;
  padding-top: 42px;
  padding-bottom: 38px;
  text-align: center;
}

#o965-final .handoff .eyebrow {
  margin-bottom: 18px;
  color: #52616a;
}

#o965-final .handoff-title {
  margin: 0 auto 15px;
  max-width: 1100px;
  font-size: clamp(30px, 3.2vw, 43px);
  line-height: 1.08;
  letter-spacing: -1px;
  white-space: nowrap;
}

#o965-final .handoff-title em {
  color: #df5d16;
  font-weight: 400;
  font-style: italic;
}

#o965-final .handoff-copy {
  margin: 0 auto 28px;
  max-width: 900px;
  color: #52616a;
  line-height: 1.55;
}

#o965-final .journey {
  width: min(100%, 1100px);
  margin: 0 auto;
}

#o965-final .journey-headings,
#o965-final .journey-line {
  display: grid;
  grid-template-columns: minmax(0, 4fr) 86px minmax(0, 3fr);
}

#o965-final .journey-headings {
  align-items: end;
  margin-bottom: 17px;
}

#o965-final .journey-headings strong {
  font-size: 11px;
  letter-spacing: 2.4px;
  text-align: left;
}

#o965-final .journey-headings strong:last-child {
  text-align: left;
  padding-left: 14px;
}

#o965-final .journey-line {
  position: relative;
  align-items: start;
}

#o965-final .journey-line::before {
  content: "";
  position: absolute;
  left: 4.5%;
  right: 4.5%;
  top: 27px;
  height: 1px;
  background: linear-gradient(to right, #ff6508 0 56%, #9da8ae 56% 100%);
  opacity: 0.72;
}

#o965-final .journey-steps {
  display: flex;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}

#o965-final .journey-business {
  padding-left: 14px;
}

#o965-final .journey-step {
  width: 25%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  opacity: 0;
  transform: translateY(8px) scale(0.97);
  transition:
    opacity 0.38s ease,
    transform 0.38s cubic-bezier(0.2, 0.7, 0.2, 1);
}

#o965-final .journey-business .journey-step {
  width: 33.333%;
}

#o965-final .journey-step.on {
  opacity: 1;
  transform: translateY(0) scale(1);
}

#o965-final .step-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff2e8;
  border: 1px solid #f7c8aa;
  color: #0a2030;
  box-shadow: 0 7px 18px rgba(10, 32, 48, 0.04);
}

#o965-final .journey-business .step-icon {
  background: #f1f2f1;
  border-color: #d9dddf;
}

#o965-final .step-icon svg {
  width: 25px;
  height: 25px;
}

#o965-final .step-label {
  font-size: 13px;
  font-weight: 700;
  color: #0a2030;
  white-space: nowrap;
}

#o965-final .journey-handoff {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 0;
  opacity: 0;
  transform: scale(0.9);
  transition:
    opacity 0.35s ease,
    transform 0.35s cubic-bezier(0.2, 0.7, 0.2, 1);
}

#o965-final .journey-handoff.on {
  opacity: 1;
  transform: scale(1);
}

#o965-final .journey-handoff span {
  position: absolute;
  top: -28px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.8px;
  color: #df5d16;
}

#o965-final .journey-handoff i {
  width: 18px;
  height: 18px;
  margin-top: 18px;
  border-radius: 50%;
  background: #ff6508;
  box-shadow: 0 0 0 6px #eae9e2;
}

@media (max-width: 1100px) {
  #o965-final .handoff-title {
    white-space: normal;
  }
}

@media (max-width: 600px) {
  #o965-final .handoff {
    padding-top: 34px;
    padding-bottom: 32px;
  }

  #o965-final .handoff .eyebrow {
    margin-bottom: 14px;
    font-size: 10px;
    letter-spacing: 2.2px;
  }

  #o965-final .handoff-title {
    max-width: 520px;
    margin: 0 auto 15px;
    padding: 0 8px;
    font-size: clamp(27px, 7.3vw, 33px);
    line-height: 1.08;
    letter-spacing: -0.5px;
    white-space: normal;
  }

  #o965-final .handoff-title em {
    display: block;
    margin-top: 2px;
  }

  #o965-final .handoff-copy {
    max-width: 500px;
    margin: 0 auto 25px;
    padding: 0 8px;
    font-size: 13.5px;
    line-height: 1.5;
  }

  #o965-final .handoff-copy br {
    display: none;
  }

  #o965-final .journey {
    width: 100%;
  }

  #o965-final .journey-headings {
    display: none;
  }

  #o965-final .journey-line {
    display: block;
  }

  #o965-final .journey-line::before {
    display: none;
  }

  #o965-final .journey-origin {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding-top: 28px;
  }

  #o965-final .journey-origin::before {
    content: "ORIGIN 965";
    position: absolute;
    top: 0;
    left: 0;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2px;
    color: #0a2030;
  }

  #o965-final .journey-origin::after {
    content: "";
    position: absolute;
    left: 12.5%;
    right: 12.5%;
    top: 50px;
    height: 1px;
    background: #ff6508;
    opacity: 0.55;
    z-index: 0;
  }

  #o965-final .journey-step,
  #o965-final .journey-business .journey-step {
    width: auto;
    position: relative;
    z-index: 1;
    gap: 7px;
  }

  #o965-final .step-icon {
    width: 46px;
    height: 46px;
  }

  #o965-final .step-icon svg {
    width: 21px;
    height: 21px;
  }

  #o965-final .step-label {
    font-size: 11px;
    white-space: nowrap;
  }

  #o965-final .journey-handoff {
    position: relative;
    height: 45px;
    margin: 24px auto 20px;
    padding-top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #o965-final .journey-handoff span {
    top: 0;
    font-size: 9px;
    letter-spacing: 1.8px;
  }

  #o965-final .journey-handoff i {
    width: 15px;
    height: 15px;
    margin-top: 22px;
    box-shadow: 0 0 0 5px #eae9e2;
  }

  #o965-final .journey-handoff::after {
    content: "";
    position: absolute;
    bottom: -7px;
    width: 1px;
    height: 11px;
    background: #c7cbcc;
  }

  #o965-final .journey-business {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    padding-left: 0;
    padding-top: 28px;
  }

  #o965-final .journey-business::before {
    content: "YOUR BUSINESS";
    position: absolute;
    top: 0;
    left: 0;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2px;
    color: #0a2030;
  }

  #o965-final .journey-business::after {
    content: "";
    position: absolute;
    left: 16.666%;
    right: 16.666%;
    top: 50px;
    height: 1px;
    background: #9da8ae;
    opacity: 0.55;
    z-index: 0;
  }
}

@media (max-width: 420px) {
  #o965-final .handoff {
    padding-left: 16px;
    padding-right: 16px;
  }

  #o965-final .handoff-title {
    font-size: 28px;
  }

  #o965-final .handoff-copy {
    font-size: 13px;
  }

  #o965-final .step-icon {
    width: 42px;
    height: 42px;
  }

  #o965-final .step-icon svg {
    width: 19px;
    height: 19px;
  }

  #o965-final .step-label {
    font-size: 10px;
  }

  #o965-final .journey-origin::after,
  #o965-final .journey-business::after {
    top: 48px;
  }
}



#o965-final footer {
  background: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
  font-size: 11px;
}

#o965-final footer .footlinks {
  display: flex;
  gap: 17px;
  flex-wrap: wrap;
}

#o965-final .booking {
  padding: 70px 6%;
  background: #f7f6f2;
}

#o965-final [hidden] {
  display: none !important;
}

#o965-final .notice {
  font-size: 12px;
  padding: 12px;
  background: #ffeadb;
  margin: 0;
}

#o965-final .booking-box {
  border: 1px solid #cdd1cd;
  padding: 25px;
  max-width: 500px;
  margin: 25px 0;
}

#o965-final a,
#o965-final button {
  cursor: var(--cursor-interaction, pointer);
}

@media (max-width: 800px) {
  #o965-final header nav {
    gap: 15px;
  }

  #o965-final .servicegrid {
    grid-template-columns: repeat(2, 1fr);
  }

  #o965-final .hero {
    gap: 14px;
  }

  #o965-final .float {
    font-size: 11px;
    padding: 10px;
  }
}

@media (max-width: 600px) {
  #o965-final .menu {
    display: block;
  }

  #o965-final header nav {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 92px;
    background: white;
    padding: 22px 6%;
    flex-direction: column;
    align-items: stretch;
    box-shadow: 0 8px 15px #0a203011;
  }

  #o965-final header nav.open {
    display: flex;
  }

  #o965-final .hero {
    grid-template-columns: 1fr;
    padding-top: 40px;
    padding-bottom: 35px;
  }

  #o965-final h1 {
    font-size: 47px;
  }

  #o965-final .art {
    height: 310px;
    max-width: 380px;
    margin: 0 auto;
    width: 100%;
  }

  #o965-final .sectionheading {
    display: block;
  }

  #o965-final .servicegrid {
    grid-template-columns: 1fr;
  }

  #o965-final .paths{
    grid-template-columns: 1fr;
  }

  #o965-final .paths {
    gap: 28px;
  }

  #o965-final footer {
    flex-wrap: wrap;
  }

}

html {
  scroll-padding-top: 105px;
}

body {
  margin: 0;
  background: #f7f6f2;
}

#o965-final .site-header {
  position: sticky;
  top: 0;
  box-shadow: 0 2px 12px #091c2b09;
}

#o965-final .canvas {
  container-type: normal;
}

#o965-final .wrap {
  padding-left: max(6%, calc((100% - 1200px) / 2));
  padding-right: max(6%, calc((100% - 1200px) / 2));
}

#o965-final h1 {
  font-size: clamp(43px, 5.5vw, 78px);
}

#o965-final h2 {
  font-size: clamp(32px, 4vw, 46px);
}

#o965-final .art {
  max-width: 430px;
  margin: auto;
  width: 100%;
}

#o965-final button:not(:disabled),
#o965-final a {
  cursor: pointer;
}

#o965-final button:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

#o965-final button:focus-visible,
#o965-final a:focus-visible {
  outline: 3px solid #df681f;
  outline-offset: 4px;
}

#o965-final .skip-link {
  position: absolute;
  top: -80px;
  left: 16px;
  background: #fff;
  padding: 15px;
  z-index: 20;
}

#o965-final .skip-link:focus {
  top: 12px;
}







#o965-final .replay {
  min-height: 44px;
}

#o965-final .art-caption {
  line-height: 1.5;
}

#o965-final .path span {
  transition: border-color 0.4s;
}

#o965-final .page {
  overflow: clip;
}

#o965-final .hero {
  min-height: 530px;
}





@media (min-width: 801px) {
  #o965-final header nav {
    display: flex !important;
  }
}

@media (max-width: 800px) {
  #o965-final .menu {
    display: block;
  }

  #o965-final header nav {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 92px;
    background: white;
    padding: 22px 6%;
    flex-direction: column;
    align-items: stretch;
    box-shadow: 0 8px 15px #0a203011;
    max-height: calc(100dvh - 92px);
    overflow: auto;
  }

  #o965-final header nav.open {
    display: flex;
  }
}

#o965-final {
  width: 100%;
  min-width: 0;
}

#o965-final .canvas {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin-inline: auto;
}

#o965-final .wrap {
  width: 100%;
  min-width: 0;
  padding-inline: max(clamp(22px, 5vw, 80px), calc((100% - 1280px) / 2));
}

#o965-final .hero > *,
#o965-final .servicegrid > *,
#o965-final .paths > * {
  min-width: 0;
}

@media (max-width: 800px) {
  #o965-final .menu {
    display: block;
  }

  #o965-final header nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: auto;
    padding: 20px;
    background: white;
    flex-direction: column;
    align-items: stretch;
  }

  #o965-final header nav.open {
    display: flex;
  }

  #o965-final .servicegrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  #o965-final .hero,
  #o965-final .servicegrid,
  #o965-final .paths{
    grid-template-columns: minmax(0, 1fr);
  }

  #o965-final .hero {
    gap: 28px;
    min-height: auto;
    padding-block: 40px;
  }

  #o965-final h1 {
    font-size: clamp(40px, 11vw, 54px);
  }

  #o965-final .art {
    width: 100%;
    max-width: 380px;
    margin-inline: auto;
  }

  #o965-final .sectionheading {
    display: block;
  }

  #o965-final footer {
    flex-wrap: wrap;
  }
}

#o965-final .canvas {
  width: 100%;
  max-width: none;
}

#o965-final .page {
  overflow: visible;
}

@media (max-width: 600px) {
  #o965-final .wrap {
    padding-inline: 24px;
  }

  #o965-final .sun {
    width: min(225px, 78%);
    aspect-ratio: 1;
    height: auto;
  }
}

#o965-final .hero > div:first-child h1 {
  opacity: 0;
  transform: translateY(24px);
  animation: o965-hero-reveal 0.75s cubic-bezier(0.2, 0.7, 0.2, 1) 0.1s forwards;
}

#o965-final .hero > div:first-child .intro {
  opacity: 0;
  transform: translateY(20px);
  animation: o965-hero-reveal 0.75s cubic-bezier(0.2, 0.7, 0.2, 1) 0.32s
    forwards;
}

#o965-final .hero > div:first-child .cta {
  opacity: 0;
  transform: translateY(16px);
  animation: o965-hero-reveal 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) 0.55s forwards;
}

@keyframes o965-hero-reveal {
  from {
    opacity: 0;
    transform: translateY(24px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

























#o965-final .services {
  position: relative;
  overflow: hidden;
  isolation: isolate;

  /* Very soft peach forms at the outer edges only. */
  background-image:
    radial-gradient(
      circle at -2% 20%,
      rgba(241, 90, 36, 0.075) 0 135px,
      rgba(241, 90, 36, 0.035) 136px 190px,
      transparent 191px
    ),
    radial-gradient(
      circle at 104% 88%,
      rgba(241, 90, 36, 0.07) 0 150px,
      rgba(241, 90, 36, 0.028) 151px 205px,
      transparent 206px
    );
  background-repeat: no-repeat;
}

#o965-final .services .sectionheading,
#o965-final .services .servicegrid {
  position: relative;
  z-index: 2;
}

#o965-final .services::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 18px;
  top: 128px;
  width: 66px;
  height: 118px;
  pointer-events: none;
  opacity: 0.68;
  background-image: radial-gradient(
    circle,
    rgba(241, 90, 36, 0.72) 1.45px,
    transparent 1.7px
  );
  background-size: 15px 15px;
}

#o965-final .services::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: -116px;
  right: -112px;
  width: 310px;
  height: 310px;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0.72;
  background: repeating-radial-gradient(
    circle at center,
    transparent 0 31px,
    rgba(241, 90, 36, 0.24) 32px 33px,
    transparent 34px 50px
  );
}

@media (max-width: 900px) {
  #o965-final .services::before {
    left: 8px;
    opacity: 0.42;
  }

  #o965-final .services::after {
    width: 245px;
    height: 245px;
    top: -92px;
    right: -100px;
    opacity: 0.48;
  }
}

@media (max-width: 600px) {
  #o965-final .services::before,
  #o965-final .services::after {
    display: none;
  }

  #o965-final .services {
    background-image:
      radial-gradient(
        circle at -18% 14%,
        rgba(241, 90, 36, 0.055) 0 105px,
        transparent 155px
      ),
      radial-gradient(
        circle at 118% 91%,
        rgba(241, 90, 36, 0.045) 0 115px,
        transparent 165px
      );
  }
}

/* ===== Services page redesign and responsive refinements ===== */

/* Services redesign. Scoped to #o965-final; shared navigation is intentionally untouched.
   1. Typography/layout  2. Hero  3. Coded mini interfaces  4. Cards  5. Handoff  6. Responsive */
@font-face{font-family:ServiceDisplay;src:url('../fonts/HTxwL3I-JCGChYJ8VI-L6OO_au7B45L0_3E.woff2') format('woff2');font-weight:900;font-display:swap}
@font-face{font-family:ServiceSans;src:url('../fonts/7cHqv4kjgoGqM7E3q-0c4A.woff2') format('woff2');font-weight:800;font-display:swap}
#o965-final{--sp-orange:#ff4e0b;--sp-ink:#071d2c;--sp-paper:#f7f5ef;color:var(--sp-ink)}
#o965-final .sp-shell{width:min(1500px,90%);margin-inline:auto}
#o965-final .sp-hero{background:var(--sp-paper);padding:70px 0 95px}
#o965-final .sp-hero-layout{display:grid;grid-template-columns:36% 1fr;gap:3%;align-items:center}
#o965-final .sp-eyebrow{display:flex;align-items:center;gap:24px;color:var(--sp-orange);font:700 12px/1.4 Arial,sans-serif;letter-spacing:4px;margin:0 0 24px}
#o965-final .sp-eyebrow i{width:65px;height:1px;background:#162e44}
#o965-final .sp-hero h1{font-family:ServiceDisplay,'Arial Narrow',sans-serif;font-weight:900;line-height:.93;letter-spacing:-.035em;font-size:clamp(46px,5.2vw,88px);margin:0 0 18px}
#o965-final .sp-hero em,#o965-final .sp-services em{font-style:normal;color:var(--sp-orange)}
#o965-final .sp-intro{font:clamp(17px,1.35vw,22px)/1.28 Georgia,serif;max-width:490px;margin:0 0 24px}
#o965-final .sp-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
#o965-final .sp-button{display:inline-flex;align-items:center;justify-content:center;background:var(--sp-orange);color:white;border:1px solid var(--sp-orange);border-radius:40px;padding:14px 25px;font:700 13px/1.3 Arial,sans-serif;text-decoration:none;cursor:pointer;min-height:46px}
#o965-final .sp-text-button{border:0;background:none;font:700 13px/1.4 Arial,sans-serif;color:var(--sp-ink);padding:12px 0;cursor:pointer}
#o965-final .outline{background:transparent;color:var(--sp-ink);border-color:var(--sp-ink)}
#o965-final .sp-button:hover{filter:brightness(.93)}
#o965-final .sp-button:focus-visible,#o965-final .sp-card-link:focus-visible,#o965-final .sp-text-button:focus-visible{outline:3px solid #137bb0;outline-offset:4px}
/* Hero: three independently responsive interface illustrations. */
#o965-final .sp-hero-journey{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding-top:45px}
#o965-final .sp-stage{min-width:0;position:relative;text-align:center}
#o965-final .stage-art{height:clamp(230px,22vw,350px);position:relative;display:flex;align-items:center;justify-content:center}
#o965-final .blob{position:absolute;inset:10% 1% 0;border-radius:35% 60% 32% 54%;background:#9bcddd;transform:rotate(-9deg)}
#o965-final .trust .blob{background:#ffca3c;transform:rotate(9deg);border-radius:44% 34% 28% 35%}
#o965-final .choose .blob{background:#93b83b;transform:rotate(8deg);border-radius:34% 35% 27% 20%}
#o965-final .hand-note{position:absolute;top:-15%;right:0;font:italic 18px/1.1 'Comic Sans MS',cursive;transform:rotate(-12deg);z-index:3;text-align:left}
#o965-final .hand-note b{display:block;font-size:27px;font-weight:400}
#o965-final .choose .hand-note{right:-5%;top:-14%}
#o965-final .sp-stage h2{font:900 clamp(34px,3.2vw,52px)/1 ServiceDisplay,sans-serif;margin:20px 0 12px;letter-spacing:-1px}
#o965-final .sp-stage>p{font:700 8px/1.5 Arial,sans-serif;letter-spacing:2px;margin:0;white-space:nowrap}
#o965-final .sp-stage>p b{display:inline-block;border:1px solid #8b9ba5;border-radius:15px;padding:2px 8px;margin-right:6px;letter-spacing:0;font-size:10px}
#o965-final .sp-stage:not(:last-child) .stage-art:after{content:'⤴';position:absolute;right:-33px;top:52%;color:var(--sp-orange);font:60px/1 Georgia,serif;transform:rotate(10deg);z-index:5}
#o965-final .phone{width:64%;height:90%;border:5px solid #161a1a;border-radius:21px;background:#fffefa;box-shadow:4px 12px 18px #071d2c25;transform:rotate(7deg);padding:16px 8px;position:relative;z-index:2;display:flex;align-items:center}
#o965-final .phone .mini-search{box-shadow:none;padding:4px;background:none;width:100%}
#o965-final .phone .search-result{display:block;margin:13px 0}
#o965-final .phone .search-result img{width:100%;height:65px;object-fit:cover}
#o965-final .phone .search-result strong{font-size:11px}
#o965-final .phone .mini-search>.skeleton{margin-top:12px}
/* Mini interfaces: all labels and chrome are live HTML, photos are standalone assets. */
#o965-final .mini-search,#o965-final .mini-social,#o965-final .mini-calendar,#o965-final .mini-booking,#o965-final .mini-website,#o965-final .mini-ad,#o965-final .mini-report{position:relative;z-index:2;background:#fff;border-radius:10px;padding:14px;box-shadow:0 9px 22px #10223212;text-align:left;color:#081d30;font-family:Arial,sans-serif;font-size:11px;line-height:1.2}
#o965-final .google-word{display:block;text-align:center;font:500 26px/1.2 Arial,sans-serif;letter-spacing:-1px;margin-bottom:12px}
#o965-final .google-word b{font-weight:500;color:#4285f4}
#o965-final .google-word b:nth-child(2),#o965-final .google-word b:nth-child(6){color:#ea4335}
#o965-final .google-word b:nth-child(3){color:#fbbc05}
#o965-final .google-word b:nth-child(5){color:#34a853}
#o965-final .search-field{padding:9px 5px;background:#fff;box-shadow:0 3px 10px #10223212;border-radius:5px;font-size:9px;font-weight:700;display:flex;justify-content:space-between;gap:4px}
#o965-final .search-field span{color:#2485ff}
#o965-final .search-result{display:flex;gap:8px;margin:12px 0;align-items:center}
#o965-final .search-result img{width:36%;height:64px;object-fit:cover;border-radius:4px}
#o965-final .search-result small{display:block;font-size:8px;margin-top:5px}
#o965-final .skeleton{display:block;width:100%;height:7px;background:#e6e7e7;border-radius:3px;margin:6px 0}
#o965-final .skeleton.short{width:65%}
#o965-final .stars{color:#ffb700;font-size:13px}
#o965-final .stage-art>.mini-social{width:87%;transform:rotate(-5deg);padding:12px;}
#o965-final .social-top{display:flex;align-items:center;gap:5px;font-size:10px;font-weight:700;padding-bottom:10px}
#o965-final .social-top>span:last-child{margin-left:auto}
#o965-final .avatar{font-size:16px}
#o965-final .social-photo{aspect-ratio:1/1.1;overflow:hidden}
#o965-final .social-photo img{width:100%;height:100%;object-fit:cover}
#o965-final .social-bottom{font-size:20px;margin-top:9px;color:#ff4c39;letter-spacing:2px}
#o965-final .social-bottom span{float:right;color:#0a2030}
#o965-final .stage-art>.mini-calendar{width:89%;transform:rotate(-4deg);padding:20px 12px}
#o965-final .mini-calendar strong{font-size:clamp(13px,1.1vw,18px)}
#o965-final .mini-calendar p{font-size:10px;margin:18px 0}
#o965-final .calendar-week,#o965-final .calendar-days{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;text-align:center;font-size:8px}
#o965-final .calendar-week{margin-bottom:14px;font-weight:700}
#o965-final .calendar-days span{padding:5px 0}
#o965-final .calendar-days .selected{border-radius:50%;background:var(--sp-orange);color:white}
#o965-final .mini-button{display:block;color:white;background:var(--sp-orange);border-radius:4px;text-align:center;font-size:11px;padding:8px;margin-top:10px}
#o965-final .mini-calendar .mini-button{background:#242725;margin-top:18px}
#o965-final .coffee-scene{aspect-ratio:1.5;position:relative;background:#b1a18b;overflow:hidden;display:flex;align-items:center;padding:10px}
#o965-final .coffee-copy{font-size:16px;font-weight:700;line-height:.96;color:white;position:relative;z-index:2}
#o965-final .cup{width:64px;height:44px;background:linear-gradient(90deg,#e5dfd0,#fff,#b2a68d);border-radius:5px 5px 30px 30px;position:absolute;right:12px;bottom:21px;box-shadow:0 12px 0 -4px #ded3bc,0 16px 12px #49362f70}
#o965-final .cup:before{content:'';position:absolute;top:-5px;left:0;width:100%;height:13px;border-radius:50%;background:#55351d;border:3px solid #f8edde;box-sizing:border-box}
#o965-final .cup:after{content:'';position:absolute;right:-12px;top:5px;width:15px;height:21px;border:5px solid #e5dfd0;border-left:0;border-radius:0 15px 15px 0}
#o965-final .mini-booking strong{font-size:14px;display:block;margin-bottom:10px}
#o965-final .mini-booking>div{background:#f4f5f7;border-radius:5px;padding:8px 5px;margin:5px 0;font-size:10px}
#o965-final .browser-dots{color:#23b859;font-size:11px;background:#f7f8f8;margin:-7px -7px 10px;padding:5px}
#o965-final .web-nav{text-align:right;font-size:7px;margin-bottom:15px}
#o965-final .web-content{display:grid;grid-template-columns:1.2fr 1fr;gap:8px}
#o965-final .web-content strong{font-size:13px}
#o965-final .web-content img{width:100%;height:95px;object-fit:cover;border-radius:3px}
#o965-final .web-content .mini-button{font-size:8px;padding:6px}
#o965-final .ad-content{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
#o965-final .ad-content img{width:100%;height:80px;object-fit:cover}
#o965-final .blue-line{display:block;width:90%;height:8px;background:#2284ff}
#o965-final .ad-badge{background:white;box-shadow:0 5px 14px #142b3415;padding:9px;position:relative;margin:8px -10px -10px 20px;font-weight:700;font-size:10px}
#o965-final .ad-badge b{float:left;color:var(--sp-orange);font-size:25px;margin-right:8px}
#o965-final .mini-report>small{float:right;font-size:7px;border:1px solid #eee;padding:3px}
#o965-final .bars{height:90px;display:flex;align-items:end;gap:4px;border-bottom:1px solid #eee;margin:16px 0 10px}
#o965-final .bars i{height:var(--bar);flex:1;background:#ff744b}
#o965-final .report-metrics{display:flex;gap:4px}
#o965-final .report-metrics span{flex:1;background:#fafafa;padding:5px 2px;font-size:7px}
#o965-final .report-metrics b{display:block;margin-top:4px;font-size:9px}
/* Square service cards: aspect ratio applies at every breakpoint. */
#o965-final .sp-services{padding:55px 0 45px;background:#fff}
#o965-final .sp-services .sp-shell{max-width:1280px}
#o965-final .sp-services .sp-eyebrow{margin-left:5%}
#o965-final .sp-services h2{font:900 clamp(38px,4.3vw,64px)/1.05 ServiceDisplay,sans-serif;text-align:center;margin:0 0 14px;letter-spacing:-1.5px}
#o965-final .sp-section-intro{font:20px/1.35 Georgia,serif;text-align:center;max-width:900px;margin:0 auto 30px}
#o965-final .sp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
#o965-final .sp-card{aspect-ratio:1;min-width:0;position:relative;isolation:isolate;border:1px solid #eeeeeb;box-shadow:0 8px 26px #172c3410;border-radius:16px;padding:24px;background:#fff;transition:opacity .65s ease,transform .65s ease;overflow:hidden;container-type:inline-size}
#o965-final .sp-card.sp-pending{opacity:0;transform:translateY(24px)}
#o965-final .sp-number{display:inline-block;border:1px solid #9eafc3;border-radius:20px;padding:3px 10px;font-size:14px;font-weight:700}
#o965-final .sp-card h3{font:900 clamp(25px,8.5cqw,36px)/1.03 ServiceDisplay,sans-serif;margin:15px 0 10px;max-width:95%;position:relative;z-index:4;letter-spacing:-.5px}
#o965-final .sp-card>p{font:clamp(14px,4.4cqw,17px)/1.3 Georgia,serif;max-width:65%;margin:0;position:relative;z-index:4}
#o965-final .sp-card-link{border:0;background:transparent;color:var(--sp-orange);font:36px/1 Arial,sans-serif;cursor:pointer;padding:6px 0;position:relative;z-index:5;min-width:44px;min-height:44px;text-align:left}
#o965-final .sp-card-art{position:absolute;width:64%;height:62%;right:4%;bottom:4%;z-index:1;display:flex;align-items:flex-end;justify-content:flex-end;pointer-events:none}
#o965-final .sp-card-art .blob{inset:-15% 6% 0 -13%;opacity:.46;background:#a5e6f6}
#o965-final .yellow .blob{background:#ffe0ae}
#o965-final .green .blob{background:#b9dfbd}
#o965-final .peach .blob{background:#ffd0bc}
#o965-final .sp-card-art>div:not(.blob){width:100%;font-size:10px}
#o965-final .centered{justify-content:center;margin-top:25px}
#o965-final .sp-tagline{font:700 9px/1.5 Arial,sans-serif;letter-spacing:3px;color:#98a3b4;display:flex;align-items:center;justify-content:center;gap:20px;margin-top:18px}
#o965-final .sp-tagline:before,#o965-final .sp-tagline:after{content:'';height:1px;width:45px;background:#aab6c4}
/* Handoff matches the reference while retaining the existing accessible SVG icons. */
#o965-final .handoff{background:#faf7f0;position:relative;overflow:hidden;padding-top:75px;padding-bottom:90px}
#o965-final .handoff:before,#o965-final .handoff:after{content:'';width:340px;height:340px;border:1px solid #ffd6b7;border-radius:50%;position:absolute;pointer-events:none}
#o965-final .handoff:before{left:-230px;top:-220px}
#o965-final .handoff:after{right:-250px;bottom:-250px}
#o965-final .handoff .eyebrow{font:12px/1.5 Arial,sans-serif;letter-spacing:4px;margin-bottom:35px}
#o965-final .handoff-title{font:800 clamp(27px,3vw,47px)/1.12 ServiceSans,Arial,sans-serif;max-width:1400px;white-space:normal}
#o965-final .handoff-title em{font:inherit;color:var(--sp-orange)}
#o965-final .handoff-copy{font-size:16px;margin-top:22px;margin-bottom:50px}
#o965-final .journey{max-width:1280px}
#o965-final .journey-origin .step-icon{color:var(--sp-orange);background:#fff9f3}
#o965-final .journey-handoff i{box-shadow:0 0 0 6px #faf7f0;background:var(--sp-orange)}
#o965-final .journey-step,#o965-final .journey-handoff{opacity:1;transform:none}
@media (min-width:901px){#o965-final .stage-art>.mini-social{animation:sp-bob 6s ease-in-out infinite}#o965-final .stage-art>.mini-calendar{animation:sp-bob 6s ease-in-out -2s infinite}}
@keyframes sp-bob{0%,100%{translate:0 0}50%{translate:0 -7px}}
@media (max-width:1100px){#o965-final .sp-hero-layout{grid-template-columns:1fr;gap:45px}#o965-final .sp-hero-copy{max-width:670px}#o965-final .sp-hero h1{font-size:72px}#o965-final .sp-hero-journey{max-width:850px;width:100%;margin:auto;padding-top:30px}#o965-final .stage-art{height:300px}#o965-final .sp-stage h2{font-size:45px}#o965-final .sp-card{padding:18px}#o965-final .sp-grid{gap:18px}#o965-final .sp-card-art{width:61%;height:57%}#o965-final .sp-card-art>div:not(.blob){padding:8px}#o965-final .sp-card-art .mini-report .bars{height:48px}#o965-final .sp-card-art .search-result img{height:40px}#o965-final .sp-card-art .web-content img{height:55px}#o965-final .sp-card-art .mini-booking>div{padding:5px}#o965-final .sp-card-art .google-word{font-size:20px;margin-bottom:7px}}
/* Two service cards on compact tablets; three from 1024px upward. */
@media (max-width:1023px){#o965-final .sp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:800px){#o965-final .sp-card-art{width:62%;height:59%}#o965-final .sp-stage>p{font-size:7px;letter-spacing:.7px}#o965-final .stage-art{height:245px}#o965-final .hand-note{font-size:15px}#o965-final .sp-section-intro{font-size:18px}#o965-final .sp-services .sp-eyebrow{margin-left:0}#o965-final .handoff-copy{font-size:15px}}
@media (max-width:560px){#o965-final .sp-shell{width:calc(100% - 40px)}#o965-final .sp-hero{padding:42px 0 48px}#o965-final .sp-hero h1{font-size:clamp(42px,11.8vw,65px)}#o965-final .sp-eyebrow{font-size:10px;letter-spacing:3px}#o965-final .sp-intro{font-size:18px}#o965-final .sp-hero-layout{gap:30px}#o965-final .sp-hero-journey{grid-template-columns:1fr;gap:62px;max-width:320px;padding-top:20px}#o965-final .stage-art{height:310px}#o965-final .sp-stage h2{font-size:48px}#o965-final .sp-stage>p{font-size:9px;letter-spacing:1.5px}#o965-final .hand-note{font-size:19px;top:0;right:-4%}#o965-final .choose .hand-note{top:0;right:-4%}#o965-final .stage-art>.mini-social,#o965-final .stage-art>.mini-calendar{width:75%}#o965-final .sp-stage:not(:last-child) .stage-art:after{content:none}#o965-final .sp-stage:not(:last-child):after{content:'↓';position:absolute;bottom:-49px;left:48%;font-size:30px;color:var(--sp-orange)}#o965-final .sp-grid{grid-template-columns:1fr;gap:22px}#o965-final .sp-card{padding:22px}#o965-final .sp-card-art{width:61%;height:61%}#o965-final .sp-section-intro br{display:none}#o965-final .sp-services{padding:40px 0}#o965-final .sp-services h2{font-size:42px}#o965-final .sp-tagline{font-size:8px;letter-spacing:1.7px;gap:8px}#o965-final .handoff{padding-top:50px;padding-bottom:55px}#o965-final .handoff-title{font-size:31px}#o965-final .sp-card-art>div:not(.blob){padding:12px}#o965-final .sp-card-art .mini-report .bars{height:65px}}
@media (prefers-reduced-motion:reduce){#o965-final .stage-art>*{animation:none!important}#o965-final .sp-card{transition:none}#o965-final .sp-card.sp-pending{opacity:1;transform:none}}
/* Keep mock interfaces below the copy on square cards. */
#o965-final .sp-card h3{font-size:clamp(26px,9.5cqw,38px)}
#o965-final .sp-card-art{width:56%;height:52%}
#o965-final .sp-card-art .coffee-copy{font-size:14px}
#o965-final .sp-card-art .social-bottom{font-size:16px}
#o965-final .sp-section-intro{max-width:1000px}
@media(min-width:1101px){#o965-final .sp-hero h1{font-size:clamp(60px,5.8vw,94px)}}
