html, body {
      overflow-x: clip;
    }

    *, *::before, *::after {
      box-sizing: border-box;
    }

    body {
      font-family: "Nunito Sans", sans-serif;
      background: #F7F6F3;
    }
    .font-script { font-family: "Allura", cursive; }
    .font-display { font-family: "Cormorant Garamond", serif; }

    .site-header {
      position: sticky;
      top: 0;
      z-index: 1000;
      background: rgba(247,246,243,.82);
      backdrop-filter: blur(10px);
      border-bottom: 1px solid rgba(170,150,190,.10);
      box-shadow: none;
    }

    .site-header,
    .header,
    .main-header {
      border-bottom: none !important;
      box-shadow: none !important;
      background: #F7F7F7 !important;
    }

    .hero-section {
      width: 100%;
      margin: 0;
      padding: 0;
      min-height: 820px;
      background: transparent;
      margin-top: -110px;
      padding-top: 110px;
    }

    .hero-section {
      border-top: none !important;
      background: #F7F7F7 !important;
      margin-top: 0 !important;
    }

    .hero-section::before,
    .hero-section::after,
    .site-header::before,
    .site-header::after {
      border: none !important;
      box-shadow: none !important;
    }

    .hero-section-grid {
      width: 100%;
      height: 100%;
      min-height: 820px;
      display: grid;
      grid-template-columns: 50% 50%;
      margin: 0;
      padding: 0;
      background: #F7F6F3;
    }

    .hero-art {
      position: relative;
      background: #F7F6F3;
      overflow: hidden;
      min-height: 820px;
    }

    .hero-art::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        linear-gradient(
          to bottom,
          #F7F6F3 0%,
          rgba(247,246,243,.82) 5%,
          rgba(247,246,243,.25) 12%,
          rgba(247,246,243,0) 22%
        );
      z-index: 3;
    }

    .hero-art img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: 42% center;
      display: block;
      filter: brightness(1.03) saturate(.92);
    }

    .hero-art::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(
          to right,
          rgba(247,247,247,0) 68%,
          rgba(247,247,247,0.12) 80%,
          rgba(247,247,247,0.42) 90%,
          rgba(247,247,247,0.82) 97%,
          #F7F7F7 100%
        );
      pointer-events: none;
    }

    .hero-content {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 6rem 5rem 6rem 3rem;
      background: #F7F6F3;
    }

    .hero-content::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(
          circle at center,
          rgba(255,255,255,.55) 0%,
          rgba(255,255,255,0) 72%
        );
      pointer-events: none;
    }

    .hero-content-inner {
      max-width: 680px;
      margin-left: 0;
      text-align: left;
      transform: translateX(-40px);
      position: relative;
      z-index: 1;
    }

    .hero-title {
      font-size: clamp(3.6rem, 5vw, 6rem);
      line-height: 0.95;
      letter-spacing: -0.01em;
      color: #20263d;
    }

    .hero-script {
      font-size: clamp(3rem, 4.5vw, 5rem);
      color: #9B70B5;
      line-height: 0.92;
      font-weight: 400;
    }

    .hero-copy {
      max-width: 560px;
      font-size: 1.15rem;
      line-height: 1.65;
      color: #454256;
    }

    .hero-symbol-wrap {
      position: absolute;
      right: 8%;
      top: 46%;
      pointer-events: none;
    }

    .hero-symbol {
      width: 150px;
      opacity: 0.28;
      filter: drop-shadow(0 0 18px rgba(180, 140, 220, 0.12));
      mix-blend-mode: multiply;
    }

    .hero-cta {
      background: #8F62AE;
      color: #fff;
      box-shadow: 0 14px 30px rgba(143, 98, 174, .22);
      opacity: 1;
    }

    @media (max-width: 1024px) {
      .hero-mark-right { display: none; }
      .hero-section-grid {
        grid-template-columns: 1fr;
        min-height: auto;
      }
      .hero-art {
        min-height: 360px;
      }
      .hero-content {
        padding: 2.25rem 1.5rem 3rem;
      }
      .hero-content-inner {
        margin-left: 0;
        transform: none;
      }
      .hero-symbol-wrap {
        right: 4%;
        top: 38%;
      }
      .hero-symbol {
        width: 112px;
      }
      .hero-title {
        font-size: clamp(2.3rem, 8vw, 3.2rem);
        line-height: 1;
      }
      .hero-script {
        font-size: clamp(2rem, 7vw, 2.8rem);
      }
      .hero-copy {
        font-size: 1rem;
        line-height: 1.55;
      }
    }

    .logo-lockup {
      display: flex;
      flex-direction: column;
      line-height: 1;
    }

    .logo-name-row {
      display: flex;
      align-items: baseline;
      white-space: nowrap;
    }

    .logo-michealle {
      font-family: "Cormorant Garamond", serif;
      font-size: clamp(2rem, 2.55vw, 2.65rem);
      font-weight: 600;
      letter-spacing: -0.01em;
      color: #2f3148;
    }

    .logo-gregory {
      font-family: "Allura", cursive;
      font-size: clamp(2rem, 2.7vw, 2.8rem);
      line-height: 0.9;
      color: #946cb5;
      margin-left: 0.6rem;
      transform: translateY(0.04rem);
      opacity: 0.95;
    }

    .logo-cred {
      margin-top: 0.18rem;
      padding-top: 0.28rem;
      border-top: 1px solid rgba(148, 108, 181, 0.26);
      font-size: 0.7rem;
      font-weight: 700;
      letter-spacing: 0.28em;
      color: #7b529a;
      white-space: nowrap;
    }

    .value-strip {
      position: relative;
      z-index: 10;
      margin-top: -78px;
      min-height: 155px;
      border-radius: 30px;
      background:
        linear-gradient(
          180deg,
          rgba(244, 233, 251, 0.88) 0%,
          rgba(232, 214, 246, 0.96) 100%
        );
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      border: 1px solid rgba(168, 128, 194, 0.14);
      overflow: hidden;
      box-shadow:
        0 12px 36px rgba(120, 88, 150, 0.08),
        0 2px 10px rgba(120, 88, 150, 0.04);
    }

    .value-card {
      display: grid;
      grid-template-columns: 68px 1fr;
      gap: 1.2rem;
      align-items: center;
      padding: 1.65rem 2rem;
      min-height: 155px;
    }

    .value-card:not(:last-child) {
      border-right: 1px solid rgba(168, 128, 194, 0.08);
    }

    .value-icon-wrapper {
      background: rgba(245, 236, 250, 0.92);
      border: 1px solid rgba(168, 128, 194, 0.16);
      border-radius: 999px;
    }

    .value-icon {
      width: 64px;
      height: 64px;
      opacity: 0.95;
    }

    .value-card h3 {
      font-family: "Inter", sans-serif;
      font-size: 1.05rem;
      line-height: 1.25;
      font-weight: 600;
      color: #302A44;
      margin-bottom: 0.7rem;
      letter-spacing: -0.02em;
    }

    .value-card p {
      font-family: "Inter", sans-serif;
      font-size: 0.92rem;
      line-height: 1.55;
      font-weight: 400;
      color: #625B72;
      max-width: 240px;
    }

    .services-section {
      background:
        linear-gradient(
          180deg,
          #f5eef9 0%,
          #f3eaf8 100%
        );
      padding-top: 2.8rem;
      padding-bottom: 3.6rem;
    }

    .services-eyebrow {
      font-size: 0.82rem;
      font-weight: 700;
      letter-spacing: 0.22em;
      color: #8b69aa;
      text-transform: uppercase;
    }

    .services-heading {
      margin: 0.7rem auto 0;
      max-width: 1100px;
      font-size: clamp(1.85rem, 3.2vw, 2.7rem);
      line-height: 1.08;
      color: #2f2b40;
    }

    .services-divider {
      margin-top: 1.25rem;
      display: inline-flex;
      align-items: center;
      gap: 0.85rem;
      color: #b293ca;
    }

    .services-divider-line {
      width: 86px;
      height: 1px;
      background: rgba(178, 147, 202, 0.55);
    }

    .services-divider-icon {
      width: 20px;
      height: 20px;
      opacity: 0.88;
    }

    .services-grid {
      margin-top: 1.5rem;
      display: grid;
      gap: 1.15rem;
      grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .service-card {
      max-width: 320px;
      width: 100%;
      margin: 0 auto;
      min-height: 360px;
      background: rgba(255, 253, 251, 0.88);
      border: 1px solid rgba(178, 147, 202, 0.2);
      border-radius: 18px;
      box-shadow: 0 5px 16px rgba(67, 45, 91, 0.05);
      padding: 1.5rem 1.5rem 1.2rem;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .service-icon {
      width: 64px;
      height: 64px;
      margin: 0 auto;
      opacity: 0.98;
      margin-top: 0.5rem;
    }

    .service-title {
      margin-top: 0.9rem;
      font-family: "Cormorant Garamond", serif;
      font-size: clamp(1.4rem, 1.95vw, 1.62rem);
      line-height: 1.08;
      color: #342b4a;
    }

    .service-copy {
      margin-top: 0.8rem;
      font-size: 0.94rem;
      line-height: 1.58;
      color: #645d76;
      max-width: 23ch;
    }

    .service-link {
      margin-top: auto;
      padding-top: 1.2rem;
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      font-size: 0.74rem;
      font-weight: 700;
      letter-spacing: 0.1em;
      color: #8c67ad;
      text-transform: uppercase;
    }

    .service-link-arrow {
      font-size: 1.05rem;
      line-height: 1;
      transform: translateY(-0.02rem);
    }

    @media (min-width: 640px) {
      .services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (min-width: 1024px) {
      .services-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
      }
    }

    .cta-band {
      min-height: 230px;
      padding: 3rem 6rem;
      margin-top: -10px;
      background:
        linear-gradient(
          135deg,
          rgba(79, 55, 111, 0.62),
          rgba(98, 68, 132, 0.54)
        ),
        url("assets/hero2/cta-band-bg.png");
      background-size: 100% calc(100% + 48px);
      background-blend-mode: multiply;
      background-position: center -24px;
      background-repeat: no-repeat;
      color: #fff;
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      gap: 5rem;
      position: relative;
      overflow: hidden;
    }

    .cta-band::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(540px 210px at 27% 34%, rgba(115, 83, 151, 0.78) 0%, rgba(115, 83, 151, 0) 72%),
        radial-gradient(460px 190px at 64% 30%, rgba(116, 84, 152, 0.72) 0%, rgba(116, 84, 152, 0) 74%),
        radial-gradient(120px 120px at 68% 82%, rgba(110, 80, 145, 0.45) 0%, rgba(110, 80, 145, 0) 100%);
      pointer-events: none;
      z-index: 0;
    }

    .cta-band > * {
      position: relative;
      z-index: 1;
    }

    .cta-band h2 {
      font-family: "Cormorant Garamond", serif;
      font-size: clamp(2rem, 2.8vw, 3rem);
      line-height: 1.08;
      font-weight: 500;
      letter-spacing: -0.01em;
      max-width: 720px;
      margin: 0 0 0.55rem;
    }

    .cta-band p {
      font-size: 1rem;
      line-height: 1.45;
      color: rgba(255, 255, 255, 0.88);
      margin-bottom: 1.25rem;
    }

    .cta-band .button {
      background: #fff;
      color: #7D559F;
      border: 1px solid rgba(255, 255, 255, 0.55);
      font-size: 0.95rem;
      letter-spacing: 0.08em;
      padding: 0.82rem 2rem;
      border-radius: 10px;
      font-weight: 700;
      text-transform: uppercase;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: auto;
      min-width: 250px;
    }

    .cta-quote {
      max-width: 650px;
      color: rgba(255, 255, 255, 0.9);
    }

    .cta-quote blockquote {
      font-size: 1.05rem;
      line-height: 1.55;
      margin: 0;
    }

    .cta-quote cite {
      display: block;
      margin-top: 0.75rem;
      font-size: 0.95rem;
      font-style: normal;
    }

    .cta-band::after {
      content: none;
    }

    .contact-strip {
      background: #F7F7F7;
      border-top: 1px solid rgba(155, 112, 181, 0.14);
      border-bottom: 1px solid rgba(155, 112, 181, 0.10);
      padding: 1.6rem 4rem;
    }

    .contact-strip-inner {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      max-width: 1500px;
      margin: 0 auto;
    }

    .contact-item {
      display: grid;
      grid-template-columns: 44px 1fr;
      gap: 0.9rem;
      align-items: center;
      padding: 0 1.4rem;
      min-width: 0;
    }

    .contact-item:not(:last-child) {
      border-right: 1px solid rgba(155, 112, 181, 0.18);
    }

    .contact-icon {
      width: 38px;
      height: 38px;
      border: 1.5px solid rgba(155, 112, 181, 0.55);
      border-radius: 999px;
      color: #8F62AE;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.95rem;
      line-height: 1;
    }

    .contact-label {
      font-size: 0.75rem;
      letter-spacing: 0.13em;
      text-transform: uppercase;
      font-weight: 700;
      color: #4F4860;
      margin-bottom: 0.2rem;
    }

    .contact-value {
      font-size: 0.98rem;
      line-height: 1.35;
      color: #4B465D;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    @media (max-width: 1024px) {
      .contact-strip {
        padding: 1.3rem 1.25rem;
      }
      .contact-strip-inner {
        grid-template-columns: 1fr;
        gap: 0.7rem;
      }
      .contact-item {
        padding: 0.55rem 0.2rem;
      }
      .contact-item:not(:last-child) {
        border-right: none;
        border-bottom: 1px solid rgba(155, 112, 181, 0.14);
      }
    }

    @media (max-width: 1024px) {
      .cta-band {
        grid-template-columns: 1fr;
        gap: 2rem;
        padding: 2.4rem 1.5rem;
      }
      .cta-band .button {
        min-width: 240px;
      }
    }

    @media (max-width: 1024px) {
      .value-strip {
        margin-top: -38px;
        min-height: auto;
      }
      .value-card {
        min-height: auto;
        grid-template-columns: 58px 1fr;
        padding: 1.2rem 1.25rem;
        gap: 0.9rem;
      }
      .value-card:not(:last-child) {
        border-right: none;
      }
      .value-icon {
        width: 52px;
        height: 52px;
      }
      .value-card h3 {
        font-size: 0.98rem;
      }
      .value-card p {
        font-size: 0.88rem;
        line-height: 1.45;
      }
    }

    @media (max-width: 640px) {
      .hero-section {
        padding-top: 0;
      }
      .hero-art {
        min-height: 290px;
      }
      .services-heading {
        max-width: 22ch;
        font-size: clamp(1.6rem, 7.6vw, 2.2rem);
      }
      .services-divider-line {
        width: 56px;
      }
      .services-grid {
        gap: 0.95rem;
      }
      .service-card {
        max-width: 100%;
        min-height: 332px;
      }
      .service-title {
        font-size: 1.38rem;
      }
      .service-copy {
        font-size: 0.9rem;
      }
      .cta-band {
        min-height: 210px;
        margin-top: -4px;
      }
      .cta-band .button {
        min-width: 100%;
      }
    }

    @media (max-width: 768px), (max-width: 1024px) and (max-height: 500px) and (orientation: landscape) {
      .hero-section,
      .hero-section.pb-20 {
        padding-top: 0.35rem;
        padding-bottom: 0 !important;
      }
      .hero-section-grid {
        gap: 0.5rem;
      }
      .hero-art {
        min-height: 255px;
      }
      .hero-art img {
        width: 100vw;
        max-width: none;
        height: 255px;
        margin: -14px 0 0 calc(50% - 50vw);
        object-fit: cover;
        object-position: center 28%;
      }
      .hero-art::after {
        background: linear-gradient(
          to bottom,
          rgba(247, 246, 243, 0) 72%,
          rgba(247, 246, 243, 0.58) 88%,
          #F7F6F3 100%
        );
      }
      .hero-content {
        padding: 1.25rem 24px 2.35rem;
      }
      .hero-content-inner {
        max-width: 360px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
      }
      .hero-title {
        font-size: clamp(2.4rem, 7.2vw, 3.6rem);
        line-height: 1.04;
        max-width: 13ch;
        letter-spacing: -0.005em;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
      }
      .hero-script {
        font-size: clamp(1.65rem, 5.5vw, 2.2rem);
        margin-top: 0.3rem !important;
      }
      .hero-content-inner .my-4 {
        margin-top: 0.9rem;
        margin-bottom: 0.95rem;
        gap: 0.7rem;
      }
      .hero-content-inner .my-4 .h-px {
        width: 22vw;
        max-width: 74px;
      }
      .hero-copy {
        font-size: 0.95rem;
        line-height: 1.55;
      }
      .hero-content-inner .mt-7 {
        margin-top: 1.25rem;
        margin-bottom: 1.25rem;
      }
      .hero-cta {
        width: 85%;
        max-width: 320px;
        justify-content: center;
        text-align: center;
      }
      .hero-symbol-wrap {
        right: 10%;
        top: 52%;
      }
      .hero-symbol {
        width: 96px;
        opacity: 0.22;
      }
      #about {
        padding-bottom: 1.5rem !important;
      }
      #services {
        padding-top: 1.5rem !important;
      }
      #contact,
      #contact.py-16 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
      }
      #about .my-4 {
        justify-content: center;
      }
      .hero-cta,
      .cta-band .button,
      #about a[href="#contact"],
      #contact button[type="submit"],
      header a[href="#contact"].flex-none,
      #site-menu-mobile a.mt-2 {
        display: flex;
        width: 85%;
        max-width: 320px;
        margin-left: auto;
        margin-right: auto;
        justify-content: center;
        text-align: center;
      }
    }

    @media (min-width: 1024px) {
      .brand-group {
        width: 430px;
        min-width: 430px;
      }
    }