/* ConnectWholesale — Home page styles
   Extracted from the approved home HTML prototype. */

:root{
      --navy:#141b2d;
      --navy-soft:#1a2238;
      --ink:#141b2d;
      --muted:#5a4a50;
      --paper:#f7f6f2;
      --white:#ffffff;
      --line:#dfdfda;
      --pink:#ff5805;
      --gold:#ff5805;
      --green:#36af83;
      --cw-dark:#141b2d;
      --cw-orange:#ff5805;
      --container:1320px;
      --ease:cubic-bezier(.2,.7,.2,1);
      --shadow:0 22px 65px rgba(20,27,45,.08);
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:#ffffff;
      color:var(--ink);
      font-family:"Satoshi","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      line-height:1.6;
      overflow-x:hidden;
    }
    body.home #main-content{
      --page-grid-mouse-x:-9999px;
      --page-grid-mouse-y:-9999px;
      --page-grid-hover-active:0;
      position:relative;
      isolation:isolate;
      background-color:#ffffff;
      background-image:
        linear-gradient(to right,rgba(12,4,7,var(--page-grid-opacity,.015)) 1px,transparent 1px),
        linear-gradient(to bottom,rgba(12,4,7,var(--page-grid-opacity,.015)) 1px,transparent 1px);
      background-size:var(--page-grid-size,36px) var(--page-grid-size,36px);
      background-position:center top;
      background-repeat:repeat;
      background-attachment:scroll;
    }
    body.home #main-content::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:0;
      pointer-events:none;
      background-image:
        linear-gradient(to right,rgba(12,4,7,var(--page-grid-hover-opacity,.11)) 1px,transparent 1px),
        linear-gradient(to bottom,rgba(12,4,7,var(--page-grid-hover-opacity,.11)) 1px,transparent 1px);
      background-size:var(--page-grid-size,36px) var(--page-grid-size,36px);
      background-position:center top;
      background-repeat:repeat;
      opacity:var(--page-grid-hover-active,0);
      mask-image:radial-gradient(circle var(--page-grid-hover-radius,220px) at var(--page-grid-mouse-x,-9999px) var(--page-grid-mouse-y,-9999px),#000 0%,transparent 100%);
      -webkit-mask-image:radial-gradient(circle var(--page-grid-hover-radius,220px) at var(--page-grid-mouse-x,-9999px) var(--page-grid-mouse-y,-9999px),#000 0%,transparent 100%);
      transition:opacity .2s ease;
    }
    body.home #main-content > *{
      position:relative;
      z-index:1;
    }
    body.home #main-content > .section{
      isolation:auto;
      border-top:0 !important;
      border-bottom:0 !important;
      background-color:transparent;
      background-image:none;
    }
    body.home #main-content > .section::before{
      content:none;
      display:none;
    }
    body.home #main-content > .section > .container{
      position:relative;
      z-index:1;
    }    a{color:inherit;text-decoration:none}
    button{font:inherit}
    .container{width:min(calc(100% - 40px),var(--container));margin-inline:auto}
    .section{padding:120px 0}
    .eyebrow{
      margin:0 0 18px;
      font-size:12px;
      line-height:1;
      font-weight:700;
      letter-spacing:.13em;
      text-transform:uppercase;
      color:var(--muted);
    }

    h1,h2,h3,h4{
      margin:0;
      font-family:"Bricolage Grotesque",sans-serif;
      letter-spacing:-.03em;
      line-height:1.05;
    }
    h1{font-size:clamp(64px,7vw,120px);font-weight:600;letter-spacing:-.035em;line-height:1.02}
    h2{font-size:clamp(40px,4.5vw,72px);font-weight:600;letter-spacing:-.03em;line-height:1.05}
    h3{font-size:clamp(26px,2.8vw,40px);font-weight:600;letter-spacing:-.02em;line-height:1.1}
    p{margin:0;color:var(--muted);font-size:17px;line-height:1.65}
    .gradient-text{
      background:linear-gradient(135deg,var(--pink) 0%,var(--gold) 100%);
      -webkit-background-clip:text;
      background-clip:text;
      -webkit-text-fill-color:transparent;
    }

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      min-height:50px;
      padding:0 24px;
      border-radius:999px;
      border:1px solid transparent;
      font-size:15px;
      font-weight:700;
      cursor:pointer;
      transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);
      will-change:transform;
    }
    .btn:hover{box-shadow:0 10px 28px rgba(11,21,52,.14)}
    .btn-primary{background:var(--navy);color:#fff}
    .btn-pink{background:var(--pink);color:#fff}
    .btn-light{background:#fff;color:var(--ink);border-color:#d7d8dc}
    .btn-dark-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}

    /* Hero Background Settings */
    :root {
      --cw-hero-overlay-color: #f6f5f1;
      --cw-hero-overlay-opacity: 0.84;
      --cw-hero-bg-pos-x: 94%;
      --cw-hero-bg-pos-y: 49%;
      --cw-hero-bg-zoom: cover;
    }

    /* ============================================================
       HERO SECTION (ANGLED CARD ON WAREHOUSE BACKGROUND)
       ============================================================ */
    .hero--reference {
      padding: 68px 0 54px;
      position: relative;
      isolation: isolate;
      overflow: hidden;
      background-color: transparent;
      background-image: var(--cw-home-hero-background, none);
      background-size: var(--cw-hero-bg-zoom, cover);
      background-position: var(--cw-hero-bg-pos-x, center) var(--cw-hero-bg-pos-y, center);
      background-repeat: no-repeat;
      background-attachment: scroll;
    }
    .hero-bg-overlay {
      display: none !important;
      position: absolute;
      inset: 0;
      background-color: var(--cw-hero-overlay-color, #ffffff);
      opacity: 0;
      pointer-events: none;
      z-index: 0;
      transition: background-color 0.15s ease, opacity 0.15s ease;
    }
    .hero-container {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      max-width: 1240px;
      min-height: auto;
      margin: 0 auto;
      padding: 0 clamp(20px, 4vw, 64px);
      position: relative;
      z-index: 1;
    }

    /* Angled Card Container */
    .hero-center {
      isolation: isolate;
      position: relative;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 100%;
      max-width: 1040px;
      margin: 0 auto;
      padding: clamp(38px, 4.2vw, 52px) clamp(28px, 5vw, 68px) clamp(34px, 3.8vw, 46px);
      z-index: 3;
    }
    .hero-center::before,
    .hero-center::after {
      content: "";
      position: absolute;
      pointer-events: none;
      transition: inset .55s var(--ease), border-radius .55s var(--ease), clip-path .55s var(--ease), background .55s var(--ease), transform .55s var(--ease), opacity .4s ease;
    }
    .hero-center > * {
      position: relative;
      z-index: 1;
    }
    .hero-card-grid-spotlight{
      position:absolute;
      inset:0 4%;
      z-index:0;
      overflow:hidden;
      border-radius:40px 0 40px 0;
      pointer-events:none;
      background-image:
        linear-gradient(to right,rgba(12,4,7,var(--page-grid-hover-opacity,.11)) 1px,transparent 1px),
        linear-gradient(to bottom,rgba(12,4,7,var(--page-grid-hover-opacity,.11)) 1px,transparent 1px);
      background-size:var(--grid-size,36px) var(--grid-size,36px);
      background-position:center top;
      background-repeat:repeat;
      opacity:0;
      transform:skewX(-8.5deg);
      mask-image:radial-gradient(circle var(--page-grid-hover-radius,220px) at var(--hero-card-grid-x,-9999px) var(--hero-card-grid-y,-9999px),#000 0%,transparent 100%);
      -webkit-mask-image:radial-gradient(circle var(--page-grid-hover-radius,220px) at var(--hero-card-grid-x,-9999px) var(--hero-card-grid-y,-9999px),#000 0%,transparent 100%);
      transition:opacity .2s ease;
    }
    .hero-center:hover .hero-card-grid-spotlight{opacity:1}

    /* White Angled Card with Top-Left and Bottom-Right Curved Corners */
    .hero-center::before {
      z-index: -1;
      inset: 0 4% 0 4%;
      border: 0;
      border-radius: 40px 0 40px 0;
      clip-path: none;
      background-color: rgba(255, 255, 255, 0.94);
      background-image:
        linear-gradient(to right, rgba(12, 4, 7, 0.045) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(12, 4, 7, 0.045) 1px, transparent 1px);
      background-size: var(--grid-size, 36px) var(--grid-size, 36px);
      background-position: center top;
      background-repeat: repeat;
      transform: skewX(-8.5deg);
    }

    /* Dark Offset Backing Card with matching Top-Left and Bottom-Right Curved Corners */
    .hero-center::after {
      z-index: -2;
      inset: 16px 2% -12px 6%;
      border-radius: 40px 0 40px 0;
      clip-path: none;
      background: #141b2d;
      box-shadow: 0 30px 70px rgba(20, 27, 45, 0.25);
      opacity: .84;
      transform: skewX(-8.5deg);
    }

    .hero-tagline-wrap {
      margin-bottom: 22px;
      display: flex;
      justify-content: center;
      width: 100%;
      text-align: center;
    }
    .hero-tagline {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #141b2d;
      text-align: center;
    }
    .tagline-emoji {
      font-size: 14px;
    }
    .hero-title {
      font-family: "Bricolage Grotesque", "Inter", -apple-system, sans-serif;
      font-size: 72px !important;
      font-weight: 700;
      letter-spacing: -0.04em;
      line-height: 1.02;
      color: #141b2d;
      margin: 0 auto 24px;
      text-align: center;
      width: 100%;
    }
    .hero-title-accent {
      color: #ff5805;
      font-weight: 700;
    }
    .hero-br-mobile {
      display: none;
    }
    .hero-br-desktop {
      display: inline;
    }
    .hero-title-rotator {
      position: relative;
      display: block;
      width: 100%;
      height: 1.15em;
      overflow: hidden;
      color: #ff5805;
      font-size: clamp(48px, 8vw, 72px);
      font-weight: 700;
      line-height: 1.05;
      perspective: 700px;
      transform-style: preserve-3d;
    }
    .hero-title-word {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0 0.04em;
      white-space: nowrap;
      opacity: 0;
      transform: translateY(100%) rotateX(-90deg);
      transform-origin: center top;
      backface-visibility: hidden;
      will-change: transform, opacity, background-position;
      background-image: linear-gradient(
        120deg,
        #ff5805 0%,
        #ff5805 32%,
        #ff8244 42%,
        #ffd294 50%,
        #ff8244 58%,
        #ff5805 68%,
        #ff5805 100%
      );
      background-size: 280% 100%;
      background-position: 100% 0;
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: #ff5805;
      transition:
        transform 0.8s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.45s ease;
    }
    .hero-title-word.is-active {
      opacity: 1;
      transform: translateY(0) rotateX(0deg);
      animation: heroWordShine 1.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s forwards;
    }
    .hero-title-word.is-leaving {
      opacity: 0;
      transform: translateY(-100%) rotateX(90deg);
      transform-origin: center bottom;
      animation: none;
    }
    @keyframes heroWordShine {
      0% {
        background-position: 100% 0;
      }
      100% {
        background-position: -25% 0;
      }
    }
    .hero-subtext {
      font-size: 18.5px;
      line-height: 1.6;
      color: #141b2d;
      opacity: 0.82;
      max-width: 760px;
      margin: 0 auto 34px;
      text-align: center;
      width: 100%;
    }
    .hero-cta-group {
      display: inline-flex;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
      justify-content: center;
      margin: 0 auto;
      text-align: center;
    }
    .btn-hero-pink {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 15px 30px;
      border-radius: 9999px;
      background: #ff5805;
      color: #ffffff !important;
      font-size: 15px;
      font-weight: 700;
      text-decoration: none;
      box-shadow: 0 10px 26px rgba(255, 88, 5, 0.28);
      transform: none !important;
      cursor: pointer;
    }
    .btn-hero-pink:hover {
      background: #ff5805;
      box-shadow: 0 10px 26px rgba(255, 88, 5, 0.28);
    }
    .btn-hero-dark {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 15px 30px;
      border-radius: 9999px;
      background: #141b2d;
      color: #ffffff !important;
      font-size: 15px;
      font-weight: 700;
      text-decoration: none;
      box-shadow: 0 10px 24px rgba(20, 27, 45, 0.25);
      transform: none !important;
      cursor: pointer;
    }
    .btn-hero-dark:hover {
      background: #141b2d;
      box-shadow: 0 10px 24px rgba(20, 27, 45, 0.25);
    }
    .btn-label-swap {
      display: grid;
      overflow: hidden;
      white-space: nowrap;
      perspective: 240px;
      transform-style: preserve-3d;
    }
    .btn-label-swap > span,
    .btn-label-swap::after {
      grid-area: 1 / 1;
      backface-visibility: hidden;
      will-change: transform, opacity;
      transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
    }
    .btn-label-swap > span {
      transform: translateY(0) rotateX(0deg);
      transform-origin: center bottom;
    }
    .btn-label-swap::after {
      content: attr(data-label);
      opacity: 0;
      transform: translateY(110%) rotateX(-90deg);
      transform-origin: center top;
    }
    .btn-hero-pink:hover .btn-label-swap > span,
    .btn-hero-pink:focus-visible .btn-label-swap > span,
    .btn-hero-dark:hover .btn-label-swap > span,
    .btn-hero-dark:focus-visible .btn-label-swap > span,
    .connect-showcase__button:hover .btn-label-swap > span,
    .connect-showcase__button:focus-visible .btn-label-swap > span {
      opacity: 0;
      transform: translateY(-110%) rotateX(90deg);
    }
    .btn-hero-pink:hover .btn-label-swap::after,
    .btn-hero-pink:focus-visible .btn-label-swap::after,
    .btn-hero-dark:hover .btn-label-swap::after,
    .btn-hero-dark:focus-visible .btn-label-swap::after,
    .connect-showcase__button:hover .btn-label-swap::after,
    .connect-showcase__button:focus-visible .btn-label-swap::after {
      opacity: 1;
      transform: translateY(0) rotateX(0deg);
    }
    .btn-arrow {
      display: inline-block;
      font-size: 16px;
      line-height: 1;
      will-change: transform;
      transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .btn-hero-pink:hover .btn-arrow,
    .btn-hero-pink:focus-visible .btn-arrow,
    .btn-hero-dark:hover .btn-arrow,
    .btn-hero-dark:focus-visible .btn-arrow,
    .connect-showcase__button:hover .btn-arrow,
    .connect-showcase__button:focus-visible .btn-arrow,
    .btn:hover .btn-arrow,
    .btn:focus-visible .btn-arrow {
      transform: translateX(5px);
    }
    /* ============================================================
       CORNER-TO-CORNER HERO MARQUEE BAR (FULL WIDTH, DOUBLE HEIGHT)
       ============================================================ */
    .hero-bottom-bar {
      --marquee-font-family: "Bricolage Grotesque", "Inter", sans-serif;
      --marquee-font-weight: 700;
      --marquee-font-style: italic;
      --marquee-text-size: 48px;
      --marquee-icon-size: 47px;
      margin-top: 0;
      position: relative;
      width: 100%;
      max-width: 100%;
      margin-inline: 0;
      background: var(--cw-marquee-bg, #141b2d);
      border-top: 1px solid var(--cw-marquee-border, rgba(255, 88, 5, 0.25));
      border-bottom: 1px solid var(--cw-marquee-border, rgba(255, 88, 5, 0.25));
      border-left: none;
      border-right: none;
      border-radius: 0 !important;
      height: 112px;
      display: flex;
      align-items: center;
      overflow: hidden;
      box-shadow: var(--cw-marquee-shadow, 0 16px 38px -6px rgba(12, 4, 7, 0.35));
      user-select: none;
      z-index: 4;
      box-sizing: border-box;
      transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
    }
    .hero-marquee-track {
      display: flex;
      width: max-content;
      animation: heroMarqueeScroll 116s linear infinite;
      will-change: transform;
      transform: translate3d(0, 0, 0);
      backface-visibility: hidden;
      align-items: center;
    }
    .hero-marquee-group {
      display: inline-flex;
      align-items: center;
      white-space: nowrap;
    }
    .hero-marquee-item {
      display: inline-flex;
      align-items: center;
      gap: 28px;
      padding: 0 44px;
      font-family: var(--marquee-font-family);
      font-size: var(--marquee-text-size);
      font-weight: var(--marquee-font-weight);
      font-style: var(--marquee-font-style);
      letter-spacing: -0.01em;
      line-height: 1;
      white-space: nowrap;
      transition: opacity 0.2s ease, color 0.3s ease;
    }
    .hero-marquee-item--orange {
      color: var(--cw-marquee-color-orange, #ff5805);
    }
    .hero-marquee-item--white {
      color: var(--cw-marquee-color-white, #ffffff);
    }
    .hero-marquee-item:hover {
      opacity: 0.88;
    }
    .marquee-chevron {
      display: none;
    }
    .hero-marquee-item::after {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 52px;
      flex: 0 0 52px;
      font-family: "Arial Black", "Arial", sans-serif;
      font-size: var(--marquee-icon-size);
      font-weight: 900;
      font-style: normal;
      line-height: 0.8;
      letter-spacing: -0.08em;
      -webkit-text-stroke: 0.35px currentColor;
      transition: color 0.3s ease;
    }
    .hero-marquee-item--orange::after {
      color: var(--cw-marquee-glyph-orange, #ffffff);
    }
    .hero-marquee-item--white::after {
      color: var(--cw-marquee-glyph-white, #ff5805);
    }
    .hero-marquee-item:nth-child(1)::after { content: "⇄"; }
    .hero-marquee-item:nth-child(2)::after { content: "✦"; }
    .hero-marquee-item:nth-child(3)::after { content: "◎"; }
    .hero-marquee-item:nth-child(4)::after { content: "↗"; }
    .hero-marquee-item:nth-child(5)::after { content: "+"; }
    .hero-marquee-item:nth-child(6)::after { content: "◆"; }
    .hero-marquee-item:nth-child(7)::after { content: "➜"; }
    .hero-marquee-item:nth-child(8)::after { content: "❯"; }
    @keyframes heroMarqueeScroll {
      0% { transform: translate3d(0, 0, 0); }
      100% { transform: translate3d(-50%, 0, 0); }
    }

    /* SECTION 1 */
    .connect-showcase__statement{
      max-width:1180px;
      margin:0 auto 56px;
      color:var(--ink);
      font-family:"Bricolage Grotesque","Inter",sans-serif;
      font-size:clamp(26px,2.4vw,38px);
      font-weight:400;
      letter-spacing:-.025em;
      line-height:1.25;
      text-align:center;
    }
    .connect-showcase__statement-first,
    .connect-showcase__statement-flow{
      display:block;
      color:inherit;
    }
    .connect-showcase__statement .connect-showcase__accent,
    .connect-showcase__copy h2 span{
      color:var(--pink);
    }
    .connect-showcase__layout{
      display:grid;
      grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
      gap:72px;
      align-items:center;
    }
    .connect-showcase__copy{
      max-width:610px;
    }
    .connect-showcase__copy h2{
      max-width:590px;
      font-size:clamp(38px,3.7vw,56px);
      font-weight:700;
    }
    .connect-showcase__copy > p{
      max-width:590px;
      margin-top:24px;
    }
    .connect-showcase__copy > p + p{
      margin-top:16px;
    }
    .connect-showcase__actions{
      display:flex;
      align-items:center;
      gap:34px;
      margin-top:34px;
    }
    .connect-showcase__button{
      min-width:0;
      white-space:nowrap;
      box-shadow:0 8px 22px rgba(12,4,7,.08);
    }
    .connect-showcase__button.btn-light{
      background:#ffffff;
      border-color:rgba(12,4,7,.12);
      color:var(--ink);
    }
    .connect-showcase__button.btn-light:hover{
      background:#ffffff;
      border-color:rgba(255,88,5,.42);
      box-shadow:0 10px 28px rgba(12,4,7,.12);
    }
    .connect-showcase__visuals{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:28px;
      align-items:start;
    }
    .connect-showcase__figure{
      margin:0;
    }
    .connect-showcase__figure--buyers{
      margin-top:92px;
    }
    .connect-showcase__media{
      position:relative;
      height:340px;
      overflow:hidden;
      border-radius:24px;
      background-color:#d8d3cf;
      background-image:
        linear-gradient(180deg,rgba(12,4,7,0.02),rgba(12,4,7,0.2)),
        var(--cw-showcase-brands-image, url("../images/brand1.png"));
      background-size:cover;
      background-position:center center;
      box-shadow:0 20px 48px rgba(12,4,7,.14);
      transform:rotate(0deg) scale(1);
      transform-origin:center;
      will-change:transform;
      transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .4s ease;
    }
    .connect-showcase__figure--buyers .connect-showcase__media{
      height:330px;
      background-image:
        linear-gradient(180deg,rgba(255,88,5,0.04),rgba(12,4,7,0.24)),
        var(--cw-showcase-buyers-image, url("../images/wholesale1.png"));
      background-position:center center;
    }
    .connect-showcase__figure--brands:hover .connect-showcase__media{
      transform:rotate(-2deg) scale(1.015);
      box-shadow:0 26px 58px rgba(12,4,7,.18);
    }
    .connect-showcase__figure--buyers:hover .connect-showcase__media{
      transform:rotate(2deg) scale(1.015);
      box-shadow:0 26px 58px rgba(12,4,7,.18);
    }
    .connect-showcase__media > span{
      position:absolute;
      left:18px;
      bottom:18px;
      padding:7px 12px;
      border:1px solid rgba(255,255,255,.32);
      border-radius:999px;
      background:rgba(12,4,7,.68);
      color:#fff;
      backdrop-filter:blur(12px);
      -webkit-backdrop-filter:blur(12px);
      font-size:12px;
      font-weight:700;
      letter-spacing:.03em;
    }
    .connect-showcase__figure figcaption{
      margin-top:15px;
      color:var(--ink);
      font-size:14px;
      line-height:1.45;
    }
    .connect-showcase__figure figcaption strong{
      font-weight:700;
    }

    .buyer-showcase__layout{
      display:grid;
      grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
      gap:72px;
      align-items:center;
    }
    .buyer-showcase__copy{
      justify-self:end;
    }
    .buyer-showcase__copy h2{
      max-width:610px;
    }
    .buyer-showcase__visuals{
      order:-1;
    }
    .buyer-showcase__figure--secondary{
      margin-top:92px;
    }
    .buyer-showcase__media--retail{
      background-image:
        linear-gradient(180deg,rgba(12,4,7,.02),rgba(12,4,7,.22)),
        var(--cw-buyers-reseller-image, url("../images/reseller.png"));
      background-position:center center;
      background-size:cover;
    }
    .buyer-showcase__media--distribution{
      height:330px;
      background-image:
        linear-gradient(180deg,rgba(255,88,5,.06),rgba(12,4,7,.25)),
        var(--cw-buyers-importer-image, url("../images/importer.png"));
      background-position:center center;
      background-size:cover;
    }
    .buyer-showcase__figure--primary:hover .connect-showcase__media{
      transform:rotate(-2deg) scale(1.015);
      box-shadow:0 26px 58px rgba(12,4,7,.18);
    }
    .buyer-showcase__figure--secondary:hover .connect-showcase__media{
      transform:rotate(2deg) scale(1.015);
      box-shadow:0 26px 58px rgba(12,4,7,.18);
    }

    .audience-intro{
      display:grid;
      grid-template-columns:.85fr 1.15fr;
      gap:72px;
      align-items:end;
    }
    .audience-intro p{max-width:650px}

    /* Brand-owner full-width image band and overlapping content card */
    .brand-growth-frame{
      position:relative;
      width:100%;
      min-height:520px;
      padding:52px 0 250px;
      background-color:#302a27;
      background-image:
        linear-gradient(180deg,rgba(12,4,7,.3),rgba(12,4,7,.62)),
        var(--cw-home-hero-background, none);
      background-size:cover;
      background-position:center 42%;
    }
    .brand-growth-frame__inner{
      position:relative;
      z-index:1;
    }
    .brand-growth-frame__top{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:28px;
      color:#ffffff;
    }
    .brand-growth-frame__identity{
      display:flex;
      align-items:center;
      gap:13px;
    }
    .brand-growth-frame__identity > span:last-child{
      display:grid;
      gap:1px;
    }
    .brand-growth-frame__identity small{
      color:rgba(255,255,255,.72);
      font-size:10px;
      font-weight:700;
      letter-spacing:.11em;
      text-transform:uppercase;
    }
    .brand-growth-frame__identity strong{
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:17px;
      line-height:1.15;
    }
    .brand-growth-frame__mark{
      position:relative;
      width:38px;
      height:38px;
      flex:0 0 38px;
      border-radius:11px;
      background:#ff5805;
    }
    .brand-growth-frame__mark::after{
      content:"";
      position:absolute;
      inset:9px;
      border:2px solid #ffffff;
      border-radius:6px;
    }
    .brand-growth-frame__kicker{
      color:rgba(255,255,255,.84);
      font-size:11px;
      font-weight:700;
      letter-spacing:.12em;
      text-transform:uppercase;
    }
    .brand-growth-frame__roles{
      display:grid;
      grid-template-columns:repeat(4,minmax(0,1fr));
      gap:14px;
      margin-top:42px;
    }
    .brand-growth-frame__roles span{
      display:flex;
      align-items:center;
      justify-content:center;
      min-height:70px;
      padding:14px;
      border:1px solid rgba(255,255,255,.24);
      border-radius:14px;
      background:rgba(255,255,255,.8);
      color:var(--ink);
      backdrop-filter:blur(16px);
      -webkit-backdrop-filter:blur(16px);
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:14px;
      font-weight:600;
      text-align:center;
      box-shadow:0 10px 26px rgba(12,4,7,.1);
    }
    .brand-growth-card{
      position:relative;
      z-index:1;
      display:grid;
      grid-template-columns:minmax(0,1fr) minmax(0,1fr);
      gap:54px 68px;
      padding:48px;
      border:1px solid rgba(12,4,7,.06);
      border-radius:30px;
      background:#ffffff;
      box-shadow:0 28px 70px rgba(12,4,7,.18);
    }
    .brand-growth-card-wrap{
      position:relative;
      z-index:2;
      margin-top:-255px;
    }
    .brand-growth-card__intro h2{
      max-width:610px;
      font-size:clamp(38px,3.7vw,56px);
      font-weight:700;
    }
    .brand-growth-card__intro h2 span{
      color:var(--pink);
    }
    .brand-growth-card__copy{
      align-self:center;
    }
    .brand-growth-card__copy p{
      max-width:600px;
    }
    .brand-growth-card__copy p + p{
      margin-top:18px;
      color:var(--ink);
    }
    .brand-growth-card__copy .btn{
      margin-top:26px;
    }
    .brand-growth-card__capabilities{
      grid-column:1 / -1;
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      column-gap:36px;
    }
    .brand-growth-card__capabilities > div{
      display:grid;
      grid-template-columns:auto 1fr;
      gap:12px;
      align-items:baseline;
      min-height:58px;
      padding:17px 0;
      border-top:1px solid var(--line);
      color:var(--ink);
    }
    .brand-growth-card__capabilities span{
      color:var(--muted);
      font-size:12px;
    }
    .brand-growth-card__capabilities strong{
      font-size:14px;
      font-weight:600;
      line-height:1.35;
    }

    /* SECTION 2 + 3 */
    .audience-feature{
      display:grid;
      grid-template-columns:.88fr 1.12fr;
      gap:24px;
      align-items:stretch;
    }
    .feature-visual,.feature-copy{
      border-radius:30px;
      overflow:hidden;
      min-height:520px;
    }
    .feature-visual{will-change:transform}
    .feature-visual{
      background:
        radial-gradient(circle at 20% 15%,rgba(255,255,255,.35),transparent 28%),
        linear-gradient(145deg,#fe6d8f 0%,#ef9d55 58%,#e7ba3a 100%);
      padding:40px;
      color:#fff;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
    }
    .feature-visual.blue{
      background:
        radial-gradient(circle at 80% 10%,rgba(255,255,255,.15),transparent 30%),
        linear-gradient(145deg,#0b1534 0%,#223568 60%,#3557a7 100%);
    }
    .visual-label{font-size:13px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
    .visual-stat{
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:clamp(62px,8vw,118px);
      letter-spacing:-.07em;
      line-height:.82;
    }
    .visual-copy{
      max-width:420px;
      color:rgba(255,255,255,.86);
      font-size:17px;
    }
    .visual-badge{
      position:absolute;z-index:3;
      background:rgba(255,255,255,.96);
      color:var(--ink);
      border-radius:14px;
      padding:11px 16px;
      font-size:13px;font-weight:700;letter-spacing:.02em;
      box-shadow:0 12px 30px rgba(0,0,0,.18);
    }
    .visual-badge--tl{top:24px;left:24px}
    .visual-badge--br{bottom:24px;right:24px}
    .feature-copy{
      background:#fff;
      border:1px solid var(--line);
      padding:58px;
    }
    .feature-copy p{margin-top:24px;max-width:650px}
    .check-list{display:grid;gap:13px;margin:30px 0 34px}
    .check-list div{display:flex;gap:12px;font-size:16px;color:#343740}
    .check-list div::before{content:"✓";font-weight:800;color:var(--green)}
    .feature-links{display:flex;gap:12px;flex-wrap:wrap}

    /* SECTION 4 */
    .process-showcase{--process-card-bg:#ffffff}
    .process-header{
      display:grid;
      grid-template-columns:minmax(0,.92fr) minmax(420px,.72fr);
      gap:72px;
      align-items:end;
      margin-bottom:56px;
    }
    .process-header__title{max-width:680px}
    .process-header h2{
      max-width:650px;
      font-size:clamp(38px,3.7vw,56px);
      font-weight:700;
    }
    .process-header h2 span{color:var(--pink)}
    .process-header__aside{display:grid;gap:28px;justify-items:start}
    .process-header__aside > p{max-width:610px}
    .process-header__actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
    .process-layout{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:22px;
      transition:opacity .2s var(--ease),transform .3s var(--ease);
    }
    .process-card{
      position:relative;
      display:flex;
      min-height:350px;
      padding:32px;
      overflow:hidden;
      flex-direction:column;
      justify-content:space-between;
      border:1px solid rgba(20,27,45,0.08);
      border-left:4px solid transparent;
      border-radius:22px;
      background:rgba(255,255,255,.94);
      box-shadow:0 10px 30px rgba(12,4,7,.045);
      transition:background-color .3s var(--ease),border-color .3s var(--ease),box-shadow .3s var(--ease);
    }
    .process-card::after{
      content:"";
      position:absolute;
      right:-58px;
      bottom:-72px;
      width:190px;
      height:190px;
      border:1px solid rgba(255,88,5,.08);
      border-radius:50%;
      box-shadow:0 0 0 24px rgba(255,88,5,.018),0 0 0 48px rgba(255,88,5,.012);
      pointer-events:none;
    }
    .process-card:hover,
    .process-card.is-in-view{
      background-color: #ffffff;
      border-color: rgba(20, 27, 45, 0.16);
      border-left: 4px solid #ff5805;
      transform: none !important;
      box-shadow: 0 14px 32px rgba(20, 27, 45, 0.08);
      animation: orangeBorderBlink 1.4s infinite ease-in-out;
    }
    .process-card:nth-child(odd):hover{transform:none !important}
    .process-card:nth-child(even):hover{transform:none !important}

    @keyframes orangeBorderBlink {
      0%, 100% {
        border-left-color: #ff5805;
        box-shadow: 0 14px 32px rgba(20, 27, 45, 0.08), -3px 0 14px rgba(255, 88, 5, 0.35);
      }
      50% {
        border-left-color: rgba(255, 88, 5, 0.25);
        box-shadow: 0 14px 32px rgba(20, 27, 45, 0.08), -1px 0 4px rgba(255, 88, 5, 0.08);
      }
    }

    .process-card__icon{
      position:relative;
      z-index:1;
      display:grid;
      width:58px;
      height:58px;
      place-items:center;
      border-radius:16px;
      background:rgba(255,88,5,.1);
      color:#ff5805;
      box-shadow:none;
      transition:transform .35s var(--ease),background .35s var(--ease),color .35s var(--ease);
    }
    .process-card:hover .process-card__icon,
    .process-card.is-in-view .process-card__icon{
      background:#ff5805;
      color:#ffffff;
      transform:none;
    }
    .process-card__icon svg{
      width:28px;
      height:28px;
      fill:none;
      stroke:currentColor;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .process-card__content{position:relative;z-index:1;margin-top:40px}
    .process-card__tag{
      display:inline-flex;
      width:max-content;
      margin-bottom:14px;
      padding:6px 12px;
      border-radius:999px;
      background:#f0efeb;
      color:#141b2d;
      font-size:11px;
      font-weight:700;
      letter-spacing:.09em;
      text-transform:uppercase;
      border:1px solid transparent;
      transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
    }
    .process-card:hover .process-card__tag,
    .process-card.is-in-view .process-card__tag{
      background:#141b2d !important;
      color:#ffffff !important;
      border:1px solid #141b2d;
    }
    .process-card h3{
      min-height:2.12em;
      margin-bottom:14px;
      font-size:clamp(27px,2.15vw,33px);
      font-weight:600;
      line-height:1.06;
      color:#141b2d;
      transition:color .3s var(--ease);
    }
    .process-card:hover h3,
    .process-card.is-in-view h3{
      color:#141b2d !important;
    }
    .process-card p{
      font-size:15px;
      line-height:1.58;
    }
    .process-card p{min-height:6.32em}


    /* SECTION 5 */
    .why-wrap{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      border-radius:32px;
      background-color:var(--navy);
      background-image:
        linear-gradient(to right,rgba(255,255,255,var(--page-grid-opacity,.015)) 1px,transparent 1px),
        linear-gradient(to bottom,rgba(255,255,255,var(--page-grid-opacity,.015)) 1px,transparent 1px);
      background-size:var(--page-grid-size,36px) var(--page-grid-size,36px);
      background-position:center top;
      color:#fff;
    }
    .why-wrap::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:0;
      pointer-events:none;
      background-image:
        linear-gradient(to right,rgba(255,88,5,var(--page-grid-hover-opacity,.11)) 1px,transparent 1px),
        linear-gradient(to bottom,rgba(255,88,5,var(--page-grid-hover-opacity,.11)) 1px,transparent 1px);
      background-size:var(--page-grid-size,36px) var(--page-grid-size,36px);
      background-position:center top;
      opacity:0;
      mask-image:radial-gradient(circle var(--page-grid-hover-radius,220px) at var(--why-grid-x,-9999px) var(--why-grid-y,-9999px),#000 0%,transparent 100%);
      -webkit-mask-image:radial-gradient(circle var(--page-grid-hover-radius,220px) at var(--why-grid-x,-9999px) var(--why-grid-y,-9999px),#000 0%,transparent 100%);
      transition:opacity .2s ease;
    }
    .why-wrap:hover::before{opacity:1}
    .why-top{
      display:grid;
      grid-template-columns:1fr .9fr;
      gap:60px;
      padding:64px;
      align-items:end;
    }
    .why-top .eyebrow{color:var(--pink)}
    .why-top h2{
      max-width:650px;
      font-size:clamp(38px,3.7vw,56px);
      font-weight:700;
    }
    .why-top h2 span{color:var(--pink)}
    .why-top p{
      max-width:610px;
      color:rgba(255,255,255,.72);
      font-size:17px;
      line-height:1.65;
    }
    .why-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      border-top:1px solid rgba(255,255,255,.11);
    }
    .why-card{
      position:relative;
      min-height:270px;
      padding:0;
      overflow:hidden;
      border-right:1px solid rgba(255,255,255,.11);
      transition:background-color .3s var(--ease);
    }
    .why-card:hover,
    .why-card.is-in-view{background-color:rgba(255,255,255,.025)}
    .why-card:last-child{border-right:0}
    .why-card__inner{
      position:relative;
      z-index:1;
      height:100%;
      min-height:270px;
      padding:34px;
      transition:transform .35s var(--ease);
      transform-origin:center;
    }
    .why-card:nth-child(odd):hover .why-card__inner{transform:translateY(-3px) rotate(-.55deg)}
    .why-card:nth-child(even):hover .why-card__inner{transform:translateY(-3px) rotate(.55deg)}
    .why-icon{
      display:grid;
      width:46px;
      height:46px;
      margin-bottom:20px;
      place-items:center;
      border:1px solid rgba(255,88,5,.45);
      border-radius:14px;
      background:rgba(255,88,5,.1);
      color:var(--pink);
      transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease);
    }
    .why-card:hover .why-icon,
    .why-card.is-in-view .why-icon{
      background:var(--pink);
      color:#ffffff;
      transform:scale(1.04);
    }
    .why-icon svg{
      width:24px;
      height:24px;
      fill:none;
      stroke:currentColor;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .why-card strong{
      display:block;
      min-height:2.24em;
      margin-bottom:14px;
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:clamp(21px,1.7vw,24px);
      font-weight:600;
      line-height:1.12;
    }
    .why-card p{
      display:-webkit-box;
      min-height:4.74em;
      overflow:hidden;
      color:rgba(255,255,255,.66);
      font-size:15px;
      line-height:1.58;
      -webkit-box-orient:vertical;
      -webkit-line-clamp:3;
    }

    /* SECTION 6 */
    .audience-intro--spaced h2{
      max-width:680px;
      font-size:clamp(38px,3.7vw,56px);
      font-weight:700;
    }
    .audience-intro--spaced h2 span{color:var(--pink)}
    .audience-intro--spaced > p{
      max-width:610px;
      color:var(--muted);
      font-size:17px;
      line-height:1.65;
    }
    .fit-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:20px;
    }
    .fit-card{
      background:#fff;
      border:1px solid var(--line);
      border-radius:28px;
      padding:48px;
      transition:box-shadow .25s var(--ease),border-color .25s var(--ease);
      will-change:transform;
    }
    .fit-card:hover{box-shadow:0 16px 40px rgba(11,21,52,.1);border-color:#d7d8dc}
    .fit-tag{
      display:inline-flex;
      align-items:center;
      margin-bottom:22px;
      padding:7px 14px;
      border:1px solid rgba(255,88,5,.14);
      border-radius:999px;
      background:rgba(255,88,5,.09);
      color:var(--pink);
      font-family:"Satoshi","Inter",sans-serif;
      font-size:11px;
      font-weight:700;
      letter-spacing:.11em;
      line-height:1;
      text-transform:uppercase;
    }
    .fit-tag--blue{
      border-color:rgba(12,4,7,.1);
      background:#f3efed;
      color:var(--ink);
    }
    .fit-card h3{
      margin-bottom:16px;
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:clamp(32px,3vw,42px);
      font-weight:600;
      line-height:1.08;
    }
    .fit-card > p{
      max-width:590px;
      margin-bottom:28px;
      color:var(--muted);
      font-family:"Satoshi","Inter",sans-serif;
      font-size:16px;
      font-weight:400;
      line-height:1.62;
    }
    .fit-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .fit-list span{
      display:flex;
      align-items:center;
      gap:11px;
      min-height:50px;
      padding:12px 16px;
      border:1px solid rgba(255,88,5,.17);
      border-radius:14px;
      background:linear-gradient(135deg,#fff1e9 0%,#fff8f4 100%);
      color:var(--ink);
      font-family:"Satoshi","Inter",sans-serif;
      font-size:14px;
      font-weight:650;
      line-height:1.35;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
      transition:transform .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);
    }
    .fit-list span::before{
      content:"";
      width:8px;
      height:8px;
      flex:0 0 8px;
      border-radius:50%;
      background:var(--pink);
      box-shadow:0 0 0 4px rgba(255,88,5,.11);
    }
    .fit-card:nth-child(2) .fit-list span{
      border-color:rgba(12,4,7,.12);
      background:linear-gradient(135deg,#f1eeec 0%,#faf8f7 100%);
    }
    .fit-card:nth-child(2) .fit-list span::before{
      background:var(--ink);
      box-shadow:0 0 0 4px rgba(12,4,7,.08);
    }
    .fit-list span:hover{
      transform:translateX(3px);
      border-color:rgba(255,88,5,.36);
      box-shadow:0 8px 20px rgba(12,4,7,.07);
    }
    .fit-card:nth-child(2) .fit-list span:hover{border-color:rgba(12,4,7,.25)}

    .commercial-fit-image-band{
      position:relative;
      width:100%;
      min-height:640px;
      padding:76px 0 400px;
      background-color:#302a27;
      background-image:
        linear-gradient(180deg,rgba(12,4,7,.34),rgba(12,4,7,.68)),
        var(--cw-commercial-fit-background,url("../images/Commercial-fit.png"));
      background-size:cover;
      background-position:center 42%;
    }
    .commercial-fit-bg-overlay{
      display:none;
    }
    .fit-card-switcher{
      display:none;
    }
    .commercial-fit-image-band .container{
      position:relative;
      z-index:1;
    }
    .commercial-fit-image-band .audience-intro--spaced{margin-bottom:0}
    .commercial-fit-image-band .eyebrow{color:rgba(255,255,255,.72)}
    .commercial-fit-image-band .audience-intro--spaced h2{color:#ffffff}
    .commercial-fit-image-band .audience-intro--spaced > p{color:rgba(255,255,255,.76)}
    .commercial-fit-cards{
      position:relative;
      z-index:2;
      margin-top:-325px;
    }
    .fit-grid--expanded .fit-card{
      position:relative;
      display:flex;
      min-height:650px;
      overflow:hidden;
      isolation:isolate;
      flex-direction:column;
      background:#ffffff;
      color:var(--ink);
      border:1px solid rgba(20,27,45,0.08);
      border-left:4px solid transparent;
      box-shadow:0 16px 40px rgba(12,4,7,0.06);
      transition:box-shadow .35s var(--ease),border-color .35s var(--ease),background-color .35s var(--ease);
    }
    .fit-grid--expanded .fit-card > *{position:relative;z-index:1}
    .fit-grid--expanded .fit-card:hover{
      transform:none !important;
      background-color:#ffffff;
      border-color:rgba(20,27,45,0.16);
      border-left:4px solid #ff5805;
      box-shadow:0 14px 32px rgba(20,27,45,0.08);
      animation:orangeBorderBlink 1.4s infinite ease-in-out;
    }
    .fit-grid--expanded .fit-card h3{color:var(--ink)}
    .fit-grid--expanded .fit-card > p{color:var(--muted)}
    .fit-grid--expanded .fit-tag{align-self:flex-start}
    .fit-grid--expanded .fit-card:first-child .fit-tag{
      border-color:rgba(255,88,5,.22);
      background:rgba(255,88,5,.09);
      color:var(--pink);
    }
    .fit-grid--expanded .fit-card:nth-child(2) .fit-tag{
      border-color:rgba(12,4,7,.12);
      background:#f3efed;
      color:var(--ink);
    }
    .fit-grid--expanded .fit-card:first-child .btn{
      border-color:var(--pink);
      background:var(--pink);
      color:#ffffff;
    }
    .fit-grid--expanded .fit-card:nth-child(2) .btn{
      border-color:var(--ink);
      background:var(--ink);
      color:#ffffff;
    }
    .fit-grid--expanded .fit-card .btn{
      align-self:flex-start;
      margin-top:auto;
    }
    .fit-detail{
      margin:30px 0 34px;
      padding-top:26px;
      border-top:1px solid var(--line);
    }
    .fit-detail h4{
      margin:0 0 16px;
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:18px;
      font-weight:600;
    }
    .fit-checks{
      display:grid;
      gap:11px;
      margin:0;
      padding:0;
      list-style:none;
    }
    .fit-checks li{
      position:relative;
      padding-left:25px;
      color:var(--muted);
      font-size:15px;
      line-height:1.48;
    }
    .fit-checks li::before{
      content:"";
      position:absolute;
      top:.48em;
      left:0;
      width:10px;
      height:10px;
      border:2px solid var(--pink);
      border-radius:50%;
    }
    .fit-grid--expanded .fit-detail{border-top-color:var(--line)}
    .fit-grid--expanded .fit-detail h4{color:var(--ink)}
    .fit-grid--expanded .fit-checks li{color:var(--muted)}
    .fit-grid--expanded .fit-card:first-child .fit-checks li::before{border-color:var(--pink)}
    .fit-grid--expanded .fit-card:nth-child(2) .fit-checks li::before{border-color:var(--ink)}
    @media(max-width:1050px){
      .commercial-fit-image-band{min-height:580px;padding-bottom:350px}
      .commercial-fit-cards{margin-top:-280px}
    }
    @media(max-width:680px){
      .commercial-fit-image-band{
        min-height:500px;
        padding:56px 0 300px;
      }
      .commercial-fit-cards{margin-top:-220px}
      .fit-grid--expanded .fit-card{min-height:0}
    }

    /* QUESTIONS AND ANSWERS */

    .faq-section{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      background-color:transparent;
    }
    .faq-section > .container{position:relative;z-index:2}
    .faq-showcase{position:relative}
    .faq-section .faq-intro h2{
      font-size:clamp(38px,3.7vw,56px);
      font-weight:700;
      line-height:.98;
      letter-spacing:-.055em;
    }
    .faq-section .faq-intro h2 span{color:var(--pink)}
    .faq-section .faq-intro > p{
      max-width:600px;
      margin-top:24px;
      font-size:17px;
      line-height:1.65;
    }
    .faq-section .faq-intro .btn{margin-top:30px}
    .faq-audience{display:grid;gap:10px;margin-top:32px}
    .faq-audience-card{position:relative;display:grid;grid-template-columns:36px 1fr;column-gap:10px;align-items:center}
    .faq-audience-card > span{grid-row:1 / 3;font-family:"Bricolage Grotesque",sans-serif;font-size:12px;font-weight:700}
    .faq-audience-card strong{font-family:"Bricolage Grotesque",sans-serif;font-size:15px;line-height:1.2}
    .faq-audience-card small{font-size:12px;line-height:1.35}
    .faq-list{position:relative}
    .faq-item{position:relative;overflow:hidden;transition:background-color .3s var(--ease),border-color .3s var(--ease),transform .3s var(--ease)}
    .faq-item h3{margin:0}
    .faq-item h3 button{
      display:grid;
      width:100%;
      padding:24px 26px;
      grid-template-columns:minmax(0,1fr) 40px;
      gap:18px;
      align-items:center;
      border:0;
      background:transparent;
      color:inherit;
      text-align:left;
      cursor:pointer;
    }
    .faq-item h3 button > span:first-child{
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:clamp(16px,1.15vw,18px);
      font-weight:600;
      letter-spacing:-.02em;
      line-height:1.22;
    }
    .faq-toggle{
      position:relative;
      width:38px;
      height:38px;
      border:1px solid rgba(12,4,7,.14);
      border-radius:50%;
      background:#fff;
      color:var(--ink);
      transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),transform .3s var(--ease);
    }
    .faq-toggle::before,.faq-toggle::after{
      content:"";
      position:absolute;
      top:50%;
      left:50%;
      width:13px;
      height:2px;
      border-radius:2px;
      background:currentColor;
      transform:translate(-50%,-50%);
      transition:transform .3s var(--ease),opacity .3s var(--ease);
    }
    .faq-toggle::after{transform:translate(-50%,-50%) rotate(90deg)}
    .faq-item.is-open .faq-toggle{transform:rotate(90deg)}
    .faq-item.is-open .faq-toggle::after{opacity:0}
    .faq-answer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s var(--ease)}
    .faq-answer > div{overflow:hidden}
    .faq-answer p{
      max-width:760px;
      padding:0 82px 0 26px;
      font-size:15px;
      line-height:1.68;
      opacity:0;
      transform:translateY(-8px);
      transition:padding .38s var(--ease),opacity .28s var(--ease),transform .38s var(--ease);
    }
    .faq-item.is-open .faq-answer{grid-template-rows:1fr}
    .faq-item.is-open .faq-answer p{padding-bottom:28px;opacity:1;transform:translateY(0)}

    /* FAQ: EDITORIAL LAYOUT */
    .faq-section{color:var(--ink);background-color:transparent}
    .faq-section .faq-showcase{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:74px;align-items:start}
    .faq-section .faq-intro{position:sticky;top:138px;padding:12px 0 36px 36px;border-left:6px solid var(--pink);max-width:530px}
    .faq-section .faq-audience-card{padding:13px 14px;border:1px solid rgba(12,4,7,.09);border-radius:14px;background:rgba(255,255,255,.64)}
    .faq-section .faq-audience-card > span{color:var(--pink)}
    .faq-section .faq-audience-card small{color:var(--muted)}
    .faq-section .faq-list{display:grid;gap:12px}
    .faq-section .faq-item{border:1px solid rgba(12,4,7,.12);border-radius:18px;background:#fff}
    .faq-section .faq-item:hover{transform:translateX(-5px);border-color:rgba(255,80,8,.32)}
    .faq-section .faq-item.is-open{z-index:1;border-color:#d3cac3;background:#e5e1dd;background-image:none}
    .faq-section .faq-answer p{color:var(--muted)}
    .faq-section .faq-item.is-open .faq-toggle{border-color:var(--ink);background:var(--ink);color:#fff}

    @media(max-width:1050px){
      .faq-section .faq-showcase{grid-template-columns:1fr;gap:52px}
      .faq-section .faq-intro{position:relative;top:auto;max-width:720px}
    }
    @media(max-width:760px){
      .faq-section{padding-top:64px;padding-bottom:64px}
      .faq-section .faq-intro h2{font-size:clamp(36px,11vw,50px)}
      .faq-item h3 button{padding:21px 18px;grid-template-columns:minmax(0,1fr) 34px;gap:12px}
      .faq-toggle{width:34px;height:34px}
      .faq-item h3 button > span:first-child{font-size:16px}
      .faq-answer p{padding-left:18px;padding-right:54px;font-size:15px}
      .faq-item.is-open .faq-answer p{padding-bottom:24px}
      .faq-section .faq-intro{padding-left:22px}
    }
    /* FINAL CTA */
    .cta-panel{
      --cta-grid-x:-9999px;
      --cta-grid-y:-9999px;
      position:relative;
      display:grid;
      grid-template-columns:minmax(0,1.15fr) minmax(300px,.55fr);
      align-items:center;
      gap:72px;
      overflow:hidden;
      isolation:isolate;
      padding:68px 64px;
      border:1px solid rgba(255,255,255,.1);
      border-radius:32px;
      background-color:var(--navy);
      background-image:
        linear-gradient(to right,rgba(255,255,255,var(--page-grid-opacity,.015)) 1px,transparent 1px),
        linear-gradient(to bottom,rgba(255,255,255,var(--page-grid-opacity,.015)) 1px,transparent 1px);
      background-size:var(--page-grid-size,36px) var(--page-grid-size,36px);
      background-position:center top;
      color:#fff;
    }
    .cta-panel::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:0;
      pointer-events:none;
      background-image:
        linear-gradient(to right,rgba(255,88,5,var(--page-grid-hover-opacity,.11)) 1px,transparent 1px),
        linear-gradient(to bottom,rgba(255,88,5,var(--page-grid-hover-opacity,.11)) 1px,transparent 1px);
      background-size:var(--page-grid-size,36px) var(--page-grid-size,36px);
      background-position:center top;
      opacity:0;
      mask-image:radial-gradient(circle var(--page-grid-hover-radius,220px) at var(--cta-grid-x) var(--cta-grid-y),#000 0%,transparent 100%);
      -webkit-mask-image:radial-gradient(circle var(--page-grid-hover-radius,220px) at var(--cta-grid-x) var(--cta-grid-y),#000 0%,transparent 100%);
      transition:opacity .2s ease;
    }
    .cta-panel:hover::before{opacity:1}
    .cta-panel > *{position:relative;z-index:1}
    .cta-copy .eyebrow{color:var(--pink)}
    .cta-copy h3{
      max-width:720px;
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:clamp(38px,3.7vw,56px);
      font-weight:700;
      line-height:1.02;
      letter-spacing:-.05em;
    }
    .cta-copy h3 span{color:var(--pink)}
    .cta-panel p{max-width:680px;margin-top:20px;color:#c8bec1;font-size:16px;line-height:1.65}
    .cta-actions{display:grid;gap:12px;width:100%;justify-self:end}
    .cta-actions .btn{
      width:100%;
      min-height:58px;
      justify-content:space-between;
      padding-inline:22px;
      transition:transform .28s var(--ease),background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);
    }
    .cta-actions .btn:hover{transform:translateX(6px)}
    .cta-actions .btn-light{border-color:#fff;background:#fff;color:var(--ink)}
    .cta-actions .btn-dark-outline{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.035);color:#fff}
    .cta-actions .btn-dark-outline:hover{border-color:var(--pink);background:rgba(255,88,5,.1)}

    .marquee-wrap{overflow:hidden;padding:48px 0 18px;--marquee-duration:24s}
    .marquee{
      display:flex;
      width:max-content;
      gap:40px;
      white-space:nowrap;
      font-family:"Bricolage Grotesque",sans-serif;
      font-size:clamp(95px,13vw,188px);
      line-height:.88;
      letter-spacing:-.07em;
      will-change:transform;
      transform:translate3d(0, 0, 0);
      backface-visibility:hidden;
      animation:marquee var(--marquee-duration) linear infinite;
    }
    .marquee-fill{color:var(--navy)}
    .marquee-outline{
      color:var(--pink);
      font-style:italic;
      -webkit-text-stroke:0;
      text-shadow:4px 4px 0 rgba(12,4,7,.1);
    }
    @keyframes marquee{
      0% { transform: translate3d(0, 0, 0); }
      100% { transform: translate3d(-50%, 0, 0); }
    }

    footer{
      margin-top:38px;
      padding:58px 0 28px;
      background:var(--navy);
      color:#fff;
      border-radius:30px 30px 0 0;
    }
    .footer-grid{
      display:grid;
      grid-template-columns:1.25fr 0.8fr 0.95fr 1.15fr;
      gap:40px;
      padding-bottom:44px;
      border-bottom:1px solid rgba(255,255,255,.1);
    }
    footer p{font-size:14px;color:#aeb6c8}
    footer h4{font-size:18px;margin-bottom:16px}
    .footer-links{display:grid;gap:10px}
    .footer-links a{font-size:14px;color:#c7ccda}
    .footer-links a:hover{color:#fff}
    .footer-bottom{
      display:flex;
      justify-content:center;
      text-align:center;
      gap:20px;
      padding-top:24px;
      font-size:12px;
      color:#8f97aa;
    }

    .reveal{
      opacity:0;
      visibility:hidden;
      transform:translateY(28px);
      transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);
    }
    .no-js .reveal{opacity:1!important;visibility:visible!important;transform:none!important}
    .reveal.visible{opacity:1;visibility:visible;transform:none}

    @media(max-width:1050px){
      .audience-intro,.audience-feature,.process-header,.why-top{grid-template-columns:1fr}
      .process-header{gap:32px}
      .process-layout{grid-template-columns:1fr}
      .connect-showcase__layout{grid-template-columns:1fr;gap:58px}
      .buyer-showcase__layout{grid-template-columns:1fr;gap:58px}
      .connect-showcase__copy{max-width:760px}
      .buyer-showcase__copy{justify-self:start}
      .connect-showcase__copy h2,.connect-showcase__copy > p{max-width:720px}
      .connect-showcase__visuals{max-width:860px}
      .brand-growth-card{grid-template-columns:1fr;gap:34px}
      .brand-growth-card__capabilities{grid-column:auto;grid-template-columns:repeat(2,minmax(0,1fr))}
      .why-grid{grid-template-columns:1fr 1fr}
      .why-card:nth-child(2){border-right:0}
      .why-card{border-bottom:1px solid rgba(255,255,255,.11)}
      .fit-grid{grid-template-columns:1fr}
      .cta-panel{grid-template-columns:1fr}
      .cta-actions{justify-content:flex-start}
      .footer-grid{grid-template-columns:1fr 1fr}
      /* Hero responsive */
      .hero-container {
        grid-template-columns: 1fr;
        gap: 36px;
      }
      .hero-flank--left, .hero-flank--right {
        transform: none !important;
      }
      .hero-flank--left:hover, .hero-flank--right:hover {
        transform: none !important;
      }
      .hero-flank--left .hero-flank-caption,
      .hero-flank--right .hero-flank-caption {
        padding-left: 0;
        padding-right: 0;
        text-align: center;
      }
      .hero-flank-card {
        height: 380px;
      }
      .hero-flank--left { order: 2; }
      .hero-center { order: 1; }
      .hero-flank--right { order: 3; }

      .float-badge{display:none}
    }

    @media(max-width:680px){
      .container{width:min(calc(100% - 24px),var(--container))}
      .section{padding:80px 0}
      .hero-bg-overlay{
        display:block !important;
        position:absolute;
        inset:0;
        background-color:#ffffff;
        opacity:0.75;
        pointer-events:none;
        z-index:0;
      }
      .hero--reference{padding:48px 0 40px}
      .hero-container{padding: 0 16px; gap: 28px;}
      .hero-flank-card{height: 280px; border-radius: 24px;}
      .hero-flank-label{font-size: clamp(48px, 16vw, 68px);}
      .hero-title{
        font-size: clamp(34px, 10vw, 46px) !important;
        line-height: 1.08;
        letter-spacing: -0.03em;
        font-weight: 700;
      }
      .hero-br-desktop {
        display: none !important;
      }
      .hero-br-mobile {
        display: inline !important;
      }
      .hero-title-rotator{
        font-size: inherit !important;
        line-height: inherit;
        height: 1.18em;
      }
      .hero-subtext{font-size: 16px; margin-bottom: 28px;}
      .hero-subtext-break{display:none;}
      .hero-cta-group{
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 360px;
        gap: 14px;
        margin: 0 auto;
      }
      .hero-cta-group .btn,
      .hero-cta-group .btn-hero-pink,
      .hero-cta-group .btn-hero-dark{
        width: 100% !important;
        min-height: 52px;
        padding: 0 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-size: 15px;
        font-weight: 700;
        box-sizing: border-box;
      }
      .hero-bottom-bar {
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 0 !important;
        height: 76px !important;
      }
      .hero-marquee-item {
        padding: 0 20px !important;
        gap: 12px !important;
        font-size: 26px !important;
      }
      .hero-marquee-item::after {
        width: 34px !important;
        flex-basis: 34px !important;
        font-size: 26px !important;
      }
      .connect-showcase__statement{
        margin-bottom:32px;
        font-size:clamp(25px,7.5vw,34px);
        text-align:center;
        margin-inline:auto;
      }
      #who-we-connect .connect-showcase__visuals{
        display:none !important;
      }
      #who-we-connect .connect-showcase__layout{
        gap:0;
      }
      #buyers .buyer-showcase__visuals{
        display:none !important;
      }
      #buyers .buyer-showcase__layout{
        gap:0;
      }
      #buyers .buyer-showcase__copy{
        justify-self:center;
      }
      .connect-showcase__statement-first,
      .connect-showcase__statement-flow{display:inline}
      .connect-showcase__layout{gap:46px}
      .connect-showcase__copy{
        text-align:center;
        max-width:100%;
        margin-inline:auto;
      }
      .connect-showcase__copy .eyebrow{
        text-align:center;
        margin-inline:auto;
      }
      .connect-showcase__copy h2{
        font-size:clamp(34px,10vw,46px);
        text-align:center;
        margin-inline:auto;
      }
      .connect-showcase__copy > p{
        text-align:center;
        margin-inline:auto;
      }
      .connect-showcase__figure figcaption{
        text-align:center;
      }
      .process-header{
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
        gap:24px;
        margin-bottom:40px;
      }
      .process-header__title{
        text-align:center;
        max-width:100%;
        margin-inline:auto;
      }
      .process-header__title .eyebrow{
        text-align:center;
        margin-inline:auto;
      }
      .process-header h2{
        font-size:clamp(34px,10vw,46px);
        text-align:center;
        margin-inline:auto;
      }
      .process-header__aside{
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
        width:100%;
        gap:20px;
        justify-items:center;
      }
      .process-header__aside > p{
        text-align:center;
        margin-inline:auto;
      }
      .process-header__actions{
        align-items:stretch;
        flex-direction:column;
        width:100%;
        max-width:360px;
        margin-inline:auto;
      }
      .process-header__actions .btn{
        width:100%;
        justify-content:center;
      }
      .process-card{
        display:grid;
        grid-template-columns:auto 1fr;
        grid-template-areas:
          "icon title"
          "pill pill"
          "desc desc";
        align-items:center;
        column-gap:16px;
        row-gap:14px;
        width:100%;
        min-height:0;
        padding:26px 20px;
      }
      .process-card__content{
        display:contents;
      }
      .process-card__icon{
        grid-area:icon;
        width:52px;
        height:52px;
        margin-bottom:0;
        align-self:center;
      }
      .process-card h3{
        grid-area:title;
        min-height:0;
        margin-bottom:0;
        font-size:clamp(20px, 5.8vw, 24px);
        line-height:1.2;
      }
      .process-br-desktop{
        display:none !important;
      }
      .process-card__tag{
        grid-area:pill;
        margin-bottom:0;
        align-self:start;
      }
      .process-card p{
        grid-area:desc;
        min-height:0;
        margin-top:0;
        font-size:15px;
        line-height:1.55;
      }
      .connect-showcase__actions{align-items:stretch;flex-direction:column;gap:20px;max-width:360px;margin-inline:auto;width:100%}
      .connect-showcase__actions .btn{width:100%}
      .connect-showcase__button{justify-content:center}
      .connect-showcase__visuals{grid-template-columns:1fr;gap:32px}
      .connect-showcase__figure--buyers{margin-top:0}
      .buyer-showcase__figure--secondary{margin-top:0}
      .connect-showcase__media,
      .connect-showcase__figure--buyers .connect-showcase__media,
      .buyer-showcase__media--distribution{height:300px}
      .brand-growth-frame{
        min-height:240px;
        padding:0;
      }
      .brand-growth-frame__inner{
        display:none !important;
      }
      .brand-growth-card{
        gap:28px;
        padding:28px 22px;
        border-radius:22px;
      }
      .brand-growth-card-wrap{margin-top:-60px}
      .brand-growth-card__intro h2{font-size:clamp(34px,10vw,46px)}
      .brand-growth-card__copy .btn{width:100%}
      .brand-growth-card__capabilities{grid-template-columns:1fr}
      .feature-copy,.feature-visual,.fit-card{padding:30px}
      .audience-intro--spaced h2{font-size:clamp(34px,10vw,46px)}
      .why-top{padding:38px 26px;text-align:center}
      .why-top .eyebrow{margin-inline:auto;text-align:center}
      .why-top h2{font-size:clamp(34px,10vw,46px);margin-inline:auto;text-align:center}
      .why-top p{margin-inline:auto;text-align:center}
      .why-grid{grid-template-columns:1fr}
      .why-card{
        min-height:0;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.11);
      }
      .why-card:last-child{border-bottom:0}
      .why-card__inner{
        display:grid;
        grid-template-columns:auto 1fr;
        grid-template-areas:
          "icon title"
          "desc desc";
        align-items:center;
        column-gap:16px;
        row-gap:12px;
        min-height:0;
        padding:26px 20px;
        text-align:left;
      }
      .why-icon{
        grid-area:icon;
        margin-bottom:0;
        align-self:center;
      }
      .why-card strong{
        grid-area:title;
        min-height:0;
        margin-bottom:0;
        font-size:20px;
        line-height:1.25;
      }
      .why-br-desktop{
        display:none !important;
      }
      .why-card p{
        grid-area:desc;
        margin-top:0;
      }
      .fit-list{grid-template-columns:1fr}

      /* Commercial Fit Overlay, Text & Card Switcher on Mobile */
      .commercial-fit-image-band{
        padding:40px 0 24px;
        min-height:0;
        background-color:transparent;
        background-image:var(--cw-commercial-fit-background, url("../images/Commercial-fit.png"));
        background-size:var(--cw-hero-bg-zoom, cover);
        background-position:var(--cw-hero-bg-pos-x, center) var(--cw-hero-bg-pos-y, center);
      }
      .commercial-fit-bg-overlay{
        display:block;
        position:absolute;
        inset:0;
        background-color:var(--cw-hero-overlay-color, #f6f5f1);
        opacity:var(--cw-hero-overlay-opacity, 0.84);
        pointer-events:none;
        z-index:0;
      }
      .commercial-fit-image-band .container{
        position:relative;
        z-index:1;
      }
      .commercial-fit-image-band .audience-intro--spaced{
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
        gap:16px;
        margin-bottom:0;
      }
      .commercial-fit-image-band .eyebrow{
        color:var(--muted) !important;
        text-align:center;
        margin-inline:auto;
      }
      .commercial-fit-image-band .audience-intro--spaced h2{
        font-size:clamp(34px,10vw,46px);
        color:var(--ink) !important;
        text-align:center;
        margin-inline:auto;
      }
      .commercial-fit-image-band .audience-intro--spaced h2 span{
        color:var(--pink) !important;
      }
      .commercial-fit-image-band .audience-intro--spaced > p{
        color:var(--ink) !important;
        text-align:center;
        margin-inline:auto;
      }
      .fit-card-switcher{
        display:flex;
        align-items:center;
        justify-content:flex-end;
        gap:12px;
        margin-top:12px;
        width:100%;
      }
      .fit-switcher-btn{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:48px;
        height:48px;
        border-radius:50%;
        background:#ffffff;
        color:var(--ink);
        border:1.5px solid rgba(20,27,45,0.16);
        box-shadow:0 6px 18px rgba(0,0,0,0.08);
        cursor:pointer;
        transition:background .25s ease,transform .15s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease;
        padding:0;
      }
      .fit-switcher-btn:hover{
        background:var(--pink) !important;
        color:#ffffff !important;
        border-color:var(--pink) !important;
      }
      .fit-switcher-btn.is-active{
        background:var(--pink) !important;
        color:#ffffff !important;
        border-color:var(--pink) !important;
        box-shadow:0 8px 24px rgba(255,88,5,0.4);
      }
      .fit-switcher-btn:active{
        transform:scale(.92);
      }
      .commercial-fit-cards{
        margin-top:14px;
      }
      .fit-grid--expanded .fit-card{
        display:none;
        min-height:0;
        animation:fitCardFadeIn .35s ease forwards;
      }
      .fit-grid--expanded .fit-card.is-active{
        display:flex;
        border-left:4px solid var(--pink);
      }
      @keyframes fitCardFadeIn{
        from{opacity:0;transform:translateY(8px)}
        to{opacity:1;transform:translateY(0)}
      }

      .cta-panel{
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
        padding:40px 24px;
        gap:32px;
      }
      .cta-copy{
        text-align:center;
        margin-inline:auto;
      }
      .cta-copy .eyebrow{
        text-align:center;
        margin-inline:auto;
      }
      .cta-copy h3{
        font-size:clamp(32px,9vw,44px);
        text-align:center;
        margin-inline:auto;
      }
      .cta-panel p{
        text-align:center;
        margin-inline:auto;
      }
      .cta-actions{
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        width:100% !important;
        max-width:360px !important;
        margin-inline:auto !important;
        gap:14px !important;
      }
      .cta-panel .cta-actions .btn,
      .cta-actions .btn,
      .cta-actions .btn-pink,
      .cta-actions .btn-light,
      .cta-actions .btn-dark-outline,
      .cta-actions .connect-showcase__button{
        width:100% !important;
        min-height:52px !important;
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        gap:10px !important;
        text-align:center !important;
        padding:0 24px !important;
        box-sizing:border-box !important;
      }
      .cta-panel .cta-actions .btn .btn-label-swap,
      .cta-actions .btn .btn-label-swap{
        display:inline-grid !important;
        text-align:center !important;
        flex:0 0 auto !important;
        width:auto !important;
        margin:0 !important;
      }
      .cta-panel .cta-actions .btn .btn-arrow,
      .cta-actions .btn .btn-arrow{
        display:inline-block !important;
        flex:0 0 auto !important;
        margin-left:0 !important;
      }
      .footer-grid{grid-template-columns:1fr 1fr;text-align:center;justify-items:center;gap:32px 16px}
      .footer-col--brand,.footer-col--contact{grid-column:1 / -1}
      .footer-col--nav{grid-column:1 / 2}
      .footer-col--legal{grid-column:2 / 3}
      .footer-bottom{flex-direction:column;justify-content:center;text-align:center}
      .visual-badge{display:none}
    }

    @media (hover: none) {
      .connect-showcase__figure:hover .connect-showcase__media {
        transform:none;
      }
      .buyer-showcase__figure:hover .connect-showcase__media {
        transform:none;
      }
      .hero-flank-description {
        inset: auto 18px 18px;
        padding: 16px 18px;
        border-radius: 16px;
        font-size: 15px;
        opacity: 1;
        transform: none;
      }
      .hero-flank:hover .hero-flank-label {
        opacity: 1;
        transform: rotate(180deg);
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .hero-title-word {
        transition: none;
        transform: none;
        animation: none !important;
      }
    }

.audience-intro--spaced { margin-bottom: 48px; }

@media (hover: none) {
  body.home #main-content > .section::before {
    display: none;
  }
}

@media (max-width: 768px) {
  .hero--reference .hero-container {
    padding-inline: 16px;
  }
  .hero--reference .hero-center,
  .hero-center {
    min-height: 0;
    padding: 24px 0 10px;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    max-width: 100%;
  }
  .hero--reference .hero-center::before,
  .hero--reference .hero-center::after,
  .hero-center::before,
  .hero-center::after,
  .hero-card-grid-spotlight {
    display: none !important;
    content: none !important;
  }
  .hero-title {
    font-size: clamp(34px, 10vw, 46px) !important;
    line-height: 1.08;
    letter-spacing: -0.03em;
    font-weight: 700;
  }
  .hero-br-desktop {
    display: none !important;
  }
  .hero-br-mobile {
    display: inline !important;
  }
  .hero-title-rotator {
    font-size: inherit !important;
    line-height: inherit;
    height: 1.18em;
  }
  .hero-cta-group {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 360px;
    gap: 14px;
    margin: 0 auto;
  }
  .hero-cta-group .btn,
  .hero-cta-group .btn-hero-pink,
  .hero-cta-group .btn-hero-dark {
    width: 100% !important;
    min-height: 52px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    box-sizing: border-box;
  }
}

/* Let the homepage hero image continue behind the transparent site header. */
body.home .site-header,
body.home .site-header:not(.is-scrolled),
body.home .site-header.is-scrolled {
  background-color: transparent !important;
  background-image: none !important;
  border-bottom: 0 !important;
}
body.home .hero--reference {
  margin-top: -98px;
  padding-top: 130px;
}

@media (max-width: 680px) {
  body.home .hero--reference {
    margin-top: -98px;
    padding-top: 118px;
  }
}
/* Remove the decorative line around the hero marquee so it does not read as a section divider. */
body.home .hero-bottom-bar{
  border-top:0;
  border-bottom:0;
}