/* Product story: readable copy and concrete workflows, with the scroll scenes retained. */
.hero { grid-template-columns: .95fr 1.05fr; gap: 28px; min-height: 700px; padding-top: 36px; }
.hero h1 { font-size: clamp(48px, 4.7vw, 67px); letter-spacing: -.065em; line-height: 1.04; margin: 0 0 24px; }
.heroCopy > p { font-size: 18px; line-height: 1.65; max-width: 510px; }
.heroCopy { padding: 20px 0; }
.actions { margin-top: 30px; }
.scene { height: 550px; }
.scene .node { width: 184px; height: 102px; padding: 16px; grid-template-columns: 26px 1fr; grid-template-rows: 25px auto; gap: 3px 9px; animation: none !important; transform: none !important; translate: none !important; }
.node .nodeIcon { grid-row: 1 / 3; width: 26px; height: 26px; margin-top: 2px; font-size: 16px; }
.node b { font-size: 16px; line-height: 1.25; }
.node > span { font-size: 12px; line-height: 1.4; }
.node-store, .node-channels { top: 13%; }
.node-ads, .node-stock { bottom: 13%; }
.hub { width: 264px; height: 192px; animation: none; }
.hubTop { height: 62px; gap: 10px; padding: 0 18px; }
.hubTop img { width: 34px; height: 34px; }
.hubTop > span { font-size: 21px; }
.hubActions { padding: 13px 15px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.hubActions > span { display: flex; align-items: center; gap: 7px; min-height: 43px; border-radius: 9px; padding: 7px; color: #48615a; background: #f5f8f5; font-size: 13px; font-weight: 550; }
.hubActions i { color: #8778df; font-size: 17px; font-style: normal; }
.heroMascot { left: calc(50% - 45px); right: auto; bottom: 10px; width: 90px; height: 90px; animation: none !important; transform: none !important; }
.fibres g { animation: none !important; }

.capabilities { max-width: 1210px; margin: 55px auto 110px; padding: 0 34px; scroll-margin-top: 30px; }
.storyHeading { max-width: 770px; margin-bottom: 38px; }
.storyHeading h2, .faqSection > h2 { font-size: clamp(35px, 3.8vw, 53px); line-height: 1.08; letter-spacing: -.055em; font-weight: 600; margin: 0 0 18px; }
.storyHeading > p { color: #637772; font-size: 18px; line-height: 1.6; margin: 0; }
.capabilityGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 19px; }
.capabilityCard { display: grid; grid-template-columns: 48px 1fr; align-content: start; gap: 12px 17px; padding: 30px; border: 1px solid #e1e8e2; border-radius: 22px; background: #fff; text-decoration: none; color: #223c35; transition: border-color .25s, box-shadow .25s; }
.capabilityCard:hover { border-color: #b6cfc2; box-shadow: 0 15px 35px #294d3c09; }
.capabilityIcon { width: 48px; height: 48px; display: grid; place-items: center; background: #edf7f0; border-radius: 14px; color: #477d69; }
.capabilityCard:nth-child(2) .capabilityIcon, .capabilityCard:nth-child(3) .capabilityIcon { background: #f0edfb; color: #8070ca; }
.capabilityIcon svg { width: 25px; height: 25px; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.capabilityCard h3 { margin: 2px 0 0; font-size: 22px; line-height: 1.25; font-weight: 600; letter-spacing: -.025em; }
.capabilityCard > p { grid-column: 2; font-size: 16px; line-height: 1.6; color: #687c73; margin: 0; }
.cardLink { grid-column: 2; font-size: 15px; margin-top: 5px; font-weight: 550; }
.cardLink b { font-weight: 500; color: #8b7dd4; margin-left: 10px; }

.tour { margin-top: 80px; margin-bottom: 75px; }
.sectionIntro h2 { font-size: clamp(36px, 4vw, 56px); line-height: 1.08; margin-bottom: 20px; }
.sectionIntro > p { font-size: 17px; line-height: 1.65; max-width: 690px; margin: auto; }
.demoTop { font-size: 14px; letter-spacing: 0; font-weight: 550; padding: 18px 22px; }
.demoTop button { font-size: 13px; }
.demoGrid { padding: 22px; gap: 12px; }
.demoProduct, .demoStep { min-height: 168px; padding: 15px; }
.demoProduct { grid-template-columns: 68px 1fr; gap: 8px 12px; }
.demoProduct b, .demoStep b { font-size: 16px; }
.demoProduct > strong { font-size: 17px; }
.demoProduct span, .demoStep em { font-size: 13px; }
.demoProduct > div:nth-child(2) { gap: 7px; }
.productArt img { width: 100%; height: 100%; object-fit: cover; display: block; }
.demoStep small, .demoInsight small { font-size: 12px; letter-spacing: 0; font-weight: 550; }
.demoStep > span { font-size: 12px; margin-bottom: 13px; }
.demoStep b { margin: 10px 0 7px; }
.reserveCount { font-size: 12px; }
.channelValues i { font-size: 12px; padding: 5px 7px; }
.demoInsight { padding: 15px; }
.demoInsight b { font-size: 15px; line-height: 1.4; }
.demoInsight span { font-size: 13px; }
.demoInsight div { gap: 6px; }
.demoBottom { font-size: 11px; letter-spacing: 0; padding: 17px 22px; }
.demoBottom button { font-size: 14px; }

.moduleName { font-size: 17px; color: #8a79d2; font-weight: 550; }
.moduleCopy h2 { font-size: clamp(38px, 4.15vw, 59px); line-height: 1.06; margin: 14px 0 19px; letter-spacing: -.065em; }
.moduleCopy > p { font-size: 17px; line-height: 1.6; max-width: 470px; }
.featureList { list-style: none; padding: 0; margin: 20px 0; display: grid; gap: 11px; }
.featureList li { position: relative; padding-left: 24px; font-size: 16px; line-height: 1.45; color: #435f53; }
.featureList li::before { content: '✓'; position: absolute; left: 0; top: 1px; color: #6eaf91; font-size: 15px; }
.moduleCopy > a { font-size: 16px; margin-top: 8px; }
.moduleVisual { height: 440px; }
html.has-scroll-motion .moduleViewport { height: min(90vh, 840px); height: min(90svh, 840px); }
html.has-scroll-motion .moduleTrack > .module { padding: 35px 7vw; gap: 5vw; grid-template-columns: .94fr 1.06fr; }
.commerceBoard, .marketBoard, .adWorkspace { width: 83%; border-radius: 18px; background: #fff; box-shadow: 0 22px 45px #29483e18; border: 1px solid #e4eae6; position: relative; }
.commerceBoard { padding: 21px; transform: perspective(1000px) rotateY(-4deg); }
.commerceBoard h3, .marketBoard h3, .adWorkspace h3 { font-size: 17px; font-weight: 600; margin: 0 0 18px; letter-spacing: -.02em; }
.boardProduct { display: flex; align-items: center; gap: 13px; padding: 12px; background: #f7f9f5; border-radius: 12px; }
.boardProduct > img { width: 62px; height: 66px; border-radius: 8px; object-fit: cover; }
.boardProduct > span { display: grid; gap: 5px; }
.boardProduct b { font-size: 15px; font-weight: 600; }
.boardProduct small { font-size: 12px; color: #8b998f; }
.boardProduct > i { margin-left: auto; color: #4c9f79; font-size: 12px; font-style: normal; }
.operationRows { display: grid; gap: 15px; padding: 19px 2px 6px; }
.operationRows > span { display: flex; gap: 9px; align-items: center; font-size: 14px; color: #526c5f; }
.operationRows i { font-style: normal; color: #6fb195; }
.marketBoard { padding: 23px; transform: perspective(1000px) rotateY(3deg); }
.marketChannels { display: grid; gap: 8px; }
.marketChannels > span { display: flex; gap: 10px; align-items: center; padding: 11px; border: 1px solid #eceaf4; border-radius: 9px; font-size: 14px; }
.marketChannels b { display: grid; place-items: center; width: 25px; height: 25px; background: #f0edfb; border-radius: 7px; color: #8373d0; font-size: 13px; }
.marketChannels i { color: #55a384; font-style: normal; margin-left: auto; font-size: 12px; }
.marketOpportunity { display: flex; align-items: start; gap: 10px; margin-top: 18px; padding: 15px; border-radius: 11px; background: #f4f2fc; }
.marketOpportunity > span { font-size: 20px; color: #8b7bd5; }
.marketOpportunity b { font-size: 14px; font-weight: 550; }
.marketOpportunity p { font-size: 13px; line-height: 1.45; margin: 5px 0 0; color: #8a8b9b; }
.visualCaption { display: block; text-align: center; font-size: 12px; color: #909a91; margin-top: 13px; }
.adWorkspace { padding: 18px; transform: rotate(-1deg); }
.adWorkspaceTop { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.adWorkspaceTop h3 { margin: 0; }
.adWorkspaceTop > span { font-size: 12px; color: #5da789; }
.adFormats { display: flex; gap: 7px; margin: 16px 0; }
.adFormats button { border: 1px solid #e7e6ed; padding: 7px 13px; background: #fff; border-radius: 20px; font-size: 13px; color: #788375; cursor: pointer; }
.adFormats button[aria-pressed='true'] { background: #eeebf9; border-color: #ded7f2; color: #7c68c5; }
.adCreation { display: grid; grid-template-columns: 1fr .83fr; gap: 15px; align-items: center; min-height: 181px; }
.adCreative { position: relative; width: 100%; border-radius: 12px; overflow: hidden; background: #e8e5dc; height: 180px; transition: height .35s, width .35s; margin: auto; }
.adCreative img { width: 100%; height: 100%; display: block; object-fit: cover; }
.adCreative > span { position: absolute; bottom: 0; left: 0; right: 0; padding: 10px; font-size: 15px; line-height: 1.2; font-weight: 550; background: #fff9; backdrop-filter: blur(8px); color: #314a40; }
.adPlan > b { font-size: 14px; font-weight: 600; }
.adPlan > p { font-size: 13px; color: #879385; line-height: 1.5; margin: 9px 0 14px; }
.adPlan > span { font-size: 12px; color: #6cab88; }
.adWorkspace[data-format='stories'] .adCreative, .adWorkspace[data-format='reels'] .adCreative { width: 113px; height: 200px; }
.adWorkspace[data-format='reels'] .adCreative::after { content: '▶'; position: absolute; left: calc(50% - 12px); top: calc(50% - 12px); width: 24px; height: 24px; border-radius: 50%; background: #fff9; color: #6a7162; font-size: 12px; display: grid; place-items: center; }
.adWorkspace .visualCaption { font-size: 12px; margin-top: 12px; }
.module-octo { width: 120px; height: 120px; }

.intelligenceHeading > h2 { font-size: clamp(40px, 4.4vw, 63px); line-height: 1.05; }
.intelligenceDeck { height: auto; display: grid; gap: 20px; }
html.has-scroll-motion .intelligenceDeck { display: block; height: min(72vh, 650px); }
.intelligenceHeading > p { font-size: 17px; line-height: 1.65; max-width: 40ch; }
.storyTextLink { font-size: 16px; color: #657d6d; display: inline-block; margin-top: 8px; text-decoration: none; }
.intelligenceCard { padding: 30px; }
.intelligenceCard > h3 { font-size: 28px; letter-spacing: -.035em; font-weight: 600; margin: 0 0 12px; line-height: 1.15; }
.intelligenceCard > p.cardLead { font-size: 17px; line-height: 1.5; color: #7d8d80; margin: 0; }
.intelligenceCard > p.sampleNote { margin-top: auto; padding-top: 22px; color: #909c91; font-size: 13px; line-height: 1.5; }
.behaviorFunnel { display: grid; gap: 22px; margin: 40px 0 25px; }
.behaviorFunnel > span { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.behaviorFunnel b { font-size: 16px; font-weight: 500; }
.behaviorFunnel strong { font-size: 20px; font-weight: 600; }
.behaviorFunnel i { grid-column: 1 / -1; display: block; background: #edeaf8; border-radius: 4px; height: 13px; overflow: hidden; }
.behaviorFunnel i::after { content: ''; display: block; width: var(--amount); height: 100%; border-radius: 4px; background: linear-gradient(90deg, #89d1b5, #ab9de9); }
.audienceGroups { display: grid; gap: 13px; margin: 30px 0 20px; }
.audienceGroups > span { display: flex; gap: 15px; align-items: center; padding: 17px; border: 1px solid #e9ece6; border-radius: 13px; }
.audienceGroups i { font-size: 24px; font-style: normal; color: #a28bdc; }
.audienceGroups div { display: grid; gap: 4px; }
.audienceGroups b { font-size: 17px; font-weight: 550; }
.audienceGroups small { font-size: 14px; color: #8e9a8c; }
.actionSuggestions { display: grid; gap: 16px; margin: 32px 0 20px; }
.actionSuggestions > span { font-size: 17px; line-height: 1.5; display: flex; gap: 14px; padding: 15px; background: #f6f7f1; border-radius: 12px; }
.actionSuggestions i { font-style: normal; color: #8e7acb; font-size: 17px; }

.agencySection { max-width: 1190px; padding: 0 34px; margin: 100px auto 120px; display: grid; grid-template-columns: .95fr 1.05fr; gap: 70px; align-items: center; scroll-margin-top: 50px; }
.agencyCopy h2 { font-size: clamp(38px, 4vw, 57px); font-weight: 600; line-height: 1.07; letter-spacing: -.06em; margin: 0 0 22px; }
.agencyCopy em { color: #8775ce; font-style: normal; }
.agencyCopy > p { color: #788c7a; font-size: 17px; line-height: 1.65; }
.agencyCopy .button { margin-top: 8px; }
.agencyVisual { border-radius: 26px; background: radial-gradient(ellipse at 40% 40%, #e8efdf, #f0f3e9); min-height: 470px; padding: 30px; position: relative; display: grid; align-items: center; }
.agencyReport { background: #fff; border: 1px solid #e5eadc; border-radius: 17px; box-shadow: 0 20px 40px #53683f12; padding: 25px; transform: rotate(1deg); }
.agencyReport h3 { margin: 0 0 20px; font-size: 20px; font-weight: 600; letter-spacing: -.03em; }
.agencyReport > div { display: flex; align-items: start; gap: 14px; margin-bottom: 16px; }
.reportIcon { flex: none; display: grid; place-items: center; width: 28px; height: 28px; font-size: 17px; border-radius: 9px; background: #f1f3e9; color: #8ea36e; }
.agencyReport p { display: grid; gap: 5px; margin: 0; }
.agencyReport b { font-size: 15px; font-weight: 550; }
.agencyReport p > span { font-size: 14px; line-height: 1.5; color: #8a9784; }
.agencyReport > small { display: block; font-size: 12px; color: #9ca58f; margin-top: 16px; }
.agencyVisual > img { width: 95px; height: 95px; object-fit: contain; position: absolute; bottom: 4px; right: 2px; }
.faqSection { max-width: 1030px; padding: 0 34px; margin: 0 auto 100px; }
.faqSection > h2 { margin-bottom: 32px; }
.faqItems { border-top: 1px solid #dfe6d8; }
.faqItems details { border-bottom: 1px solid #dfe6d8; }
.faqItems summary { list-style: none; cursor: pointer; padding: 25px 0; display: flex; justify-content: space-between; gap: 20px; font-size: 20px; line-height: 1.4; font-weight: 500; letter-spacing: -.02em; }
.faqItems summary::-webkit-details-marker { display: none; }
.faqItems summary > span { color: #a38ad5; font-size: 23px; }
.faqItems details[open] summary > span { transform: rotate(45deg); }
.faqItems p { margin: 0 0 26px; font-size: 17px; line-height: 1.7; color: #788c7a; max-width: 80ch; }
.faqItems a { color: #6d855e; }
.ctaCopy > p { font-size: 18px; line-height: 1.6; max-width: 490px; margin: -6px auto 26px; color: #6e8572; }
.ctaCopy > img { animation: none; }
.ctaActions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.footerLinks { display: flex; gap: 28px; }
.footerLinks a { color: #69806c; font-size: 14px; text-decoration: none; }

@media (min-width: 901px) and (max-width: 1150px) {
  .hero { grid-template-columns: .9fr 1.1fr; gap: 18px; }
  .hero h1 { font-size: 52px; }
  .scene .node { width: 157px; padding: 12px; }
  .node b { font-size: 14px; }
  .node > span { font-size: 12px; }
  .hub { width: 233px; }
  html.has-scroll-motion .moduleTrack > .module { padding: 25px 4vw; gap: 4vw; }
  .moduleCopy h2 { font-size: 42px; }
  .moduleCopy > p { font-size: 16px; }
  .featureList li { font-size: 15px; }
  .intelligenceInner { gap: 40px; }
  .agencySection { gap: 35px; }
}
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; min-height: 0; padding-top: 40px; }
  .heroCopy { max-width: 690px; }
  .hero h1 { font-size: clamp(48px, 7.8vw, 67px); }
  .heroCopy > p { max-width: 630px; }
  .scene { height: 550px; max-width: 760px; margin: auto; }
  .capabilities { margin-top: 45px; }
  .moduleTrack > .module { grid-template-columns: 1fr; gap: 30px; padding: 0 18px; }
  .moduleTrack > .module.reverse .moduleCopy, .moduleTrack > .module.reverse .moduleVisual { order: initial; }
  .moduleCopy > p { max-width: 630px; }
  .moduleVisual { max-width: 650px; width: 100%; justify-self: center; }
  .moduleCopy h2 { font-size: 51px; }
  .agencySection { grid-template-columns: 1fr; gap: 35px; }
  .agencyVisual { max-width: 650px; width: 100%; justify-self: center; }
  .intelligenceDeck { height: auto; display: grid; gap: 20px; }
  .intelligenceCard { min-height: 470px; }
  .intelligenceProgress { display: none; }
}
@media (max-width: 680px) {
  .hero { padding: 25px 18px 45px; gap: 20px; }
  .heroCopy { padding: 20px 0 10px; }
  .hero h1 { font-size: clamp(35px, 9.9vw, 53px); margin-bottom: 21px; letter-spacing: -.06em; }
  .heroCopy > p { font-size: 17px; line-height: 1.65; }
  .hero .actions { gap: 9px; margin-top: 25px; }
  .hero .button { font-size: 13px; padding: 13px 15px; gap: 10px; }
  .scene { height: 525px; }
  .scene .node { width: 138px; height: 105px; padding: 12px 10px; grid-template-columns: 21px 1fr; gap: 4px 6px; }
  .node .nodeIcon { width: 21px; height: 23px; font-size: 14px; }
  .node b { font-size: 13px; }
  .node > span { font-size: 12px; line-height: 1.35; }
  .node-store, .node-channels { top: 10%; }
  .node-ads, .node-stock { bottom: 13%; }
  .hub { width: 215px; height: 180px; top: 50%; }
  .hubTop { height: 53px; padding: 0 14px; }
  .hubTop > span { font-size: 19px; }
  .hubActions { gap: 6px; padding: 11px; }
  .hubActions > span { font-size: 12px; min-height: 44px; padding: 7px 5px; gap: 5px; }
  .hubActions i { font-size: 15px; }
  .heroMascot { width: 62px; height: 62px; left: calc(50% - 31px); bottom: 5px; }
  .capabilities { padding: 0 18px; margin: 36px auto 80px; }
  .storyHeading { margin-bottom: 25px; }
  .storyHeading h2 { font-size: 35px; }
  .storyHeading > p { font-size: 17px; }
  .capabilityGrid { grid-template-columns: 1fr; gap: 13px; }
  .capabilityCard { padding: 23px; gap: 13px; grid-template-columns: 41px 1fr; border-radius: 18px; }
  .capabilityIcon { width: 41px; height: 41px; border-radius: 11px; }
  .capabilityCard h3 { font-size: 21px; }
  .capabilityCard > p, .capabilityCard .cardLink { grid-column: 1 / -1; }
  .capabilityCard > p { font-size: 16px; }
  .cardLink { font-size: 15px; }
  .sectionIntro h2 { font-size: 37px; }
  .sectionIntro > p { font-size: 16px; max-width: 100%; }
  .demoTop { font-size: 13px; padding: 14px; }
  .demoGrid { padding: 13px; gap: 10px; }
  .demoProduct { min-height: 110px; }
  .demoStep { min-height: 157px; padding: 12px; }
  .demoStep b { font-size: 15px; }
  .demoStep em { font-size: 12px; }
  .demoInsight { gap: 9px; padding: 13px; }
  .demoInsight img { width: 40px; height: 40px; }
  .demoInsight b { font-size: 13px; }
  .demoInsight span, .demoInsight small { font-size: 12px; }
  .demoInsight .insightCheck { display: none; }
  .demoBottom { flex-direction: column; gap: 13px; padding: 14px; }
  .demoBottom > span { max-width: 100%; font-size: 12px; }
  .demoBottom button { font-size: 13px; width: 100%; }
  .moduleTrack { gap: 75px; padding: 0 18px; }
  .moduleTrack > .module { padding: 0; }
  .moduleName { font-size: 16px; }
  .moduleCopy h2 { font-size: 42px; }
  .moduleCopy > p { font-size: 17px; }
  .featureList li { font-size: 16px; }
  .moduleVisual { height: 395px; border-radius: 22px; }
  .commerceBoard, .marketBoard, .adWorkspace { width: 89%; }
  .commerceBoard, .marketBoard { padding: 18px; }
  .boardProduct { padding: 9px; gap: 9px; }
  .boardProduct > img { width: 47px; height: 54px; }
  .boardProduct b { font-size: 14px; }
  .boardProduct small { font-size: 11px; }
  .boardProduct > i { display: none; }
  .operationRows > span { font-size: 13px; }
  .module-octo { width: 95px; height: 95px; }
  .marketChannels > span { padding: 8px; font-size: 13px; }
  .marketOpportunity { padding: 12px; margin-top: 13px; }
  .marketOpportunity p { font-size: 12px; }
  .marketOpportunity b { font-size: 13px; }
  .adWorkspace { padding: 15px; }
  .adWorkspace h3 { font-size: 16px; }
  .adWorkspaceTop > span { font-size: 11px; }
  .adCreation { gap: 11px; }
  .adPlan > b { font-size: 13px; }
  .adPlan > p { font-size: 12px; }
  .adPlan > span { font-size: 11px; }
  .adCreative > span { font-size: 14px; }
  .adFormats { gap: 6px; }
  .adFormats button { font-size: 13px; padding: 6px 11px; }
  .adWorkspace[data-format='stories'] .adCreative, .adWorkspace[data-format='reels'] .adCreative { width: 100%; height: 190px; max-width: 108px; }
  .intelligenceHeading > h2 { font-size: 43px; }
  .intelligenceHeading > p { font-size: 17px; }
  .intelligenceCard { min-height: 430px; padding: 24px; }
  .intelligenceCard > h3 { font-size: 26px; }
  .intelligenceCard > p.cardLead { font-size: 16px; }
  .behaviorFunnel { margin-top: 30px; }
  .behaviorFunnel b { font-size: 15px; }
  .audienceGroups b, .actionSuggestions > span { font-size: 16px; }
  .audienceGroups small { font-size: 13px; }
  .agencySection { padding: 0 18px; margin: 70px auto 80px; }
  .agencyCopy h2 { font-size: 42px; }
  .agencyVisual { min-height: 440px; padding: 21px; }
  .agencyReport { padding: 20px; }
  .agencyReport h3 { font-size: 20px; }
  .agencyReport > div { gap: 10px; }
  .agencyReport p > span { font-size: 13px; }
  .faqSection { padding: 0 19px; margin-bottom: 60px; }
  .faqSection > h2 { font-size: 37px; }
  .faqItems summary { font-size: 18px; padding: 22px 0; }
  .faqItems p { font-size: 16px; }
  .ctaCopy > p { font-size: 17px; }
  .ctaActions { gap: 9px; }
  .ctaActions .button { font-size: 13px; }
  footer { gap: 18px; }
  .footerLinks { order: 3; width: 100%; justify-content: space-between; gap: 15px; padding-top: 5px; }
  .footerLinks a { font-size: 13px; }
}
@media (max-width: 360px) {
  .scene .node { width: 123px; padding: 12px 8px; grid-template-columns: 18px 1fr; gap: 4px; }
  .node .nodeIcon { width: 18px; }
  .node b { font-size: 12px; }
  .node > span { font-size: 11px; }
  .hero .actions { display: grid; grid-template-columns: 1fr; }
  .hero .button { justify-content: center; }
  .hub { width: 202px; }
}
@media (prefers-reduced-motion: reduce) {
  .adCreative { transition: none; }
}

/* Text inverts against the content beneath it; the original logo has its own normal layer. */
body { padding-top: 82px; }
.nav { position: fixed; top: 0; left: 0; right: 0; z-index: 50; width: 100%; max-width: 1380px; height: 82px; margin: 0 auto; background: transparent; mix-blend-mode: difference; }
.fixedBrandMark { position: fixed; z-index: 51; top: 22px; left: max(44px, calc((100vw - 1380px) / 2 + 44px)); width: 38px; height: 38px; pointer-events: none; }
.fixedBrandMark > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.brandSpacer { display: block; width: 38px; height: 38px; flex: none; }
.nav .brand strong, .nav .brand strong span, .nav .navlinks a, .nav .navcta { color: #fff; }
.nav .navcta { background: transparent; border-color: #ffffff80; color: #fff; box-shadow: none; }
.nav .navcta span { color: inherit; }
.headerActions { display: flex; align-items: center; gap: 23px; }
.languageSwitch { display: flex; align-items: center; gap: 7px; color: #fff; }
.languageSwitch > span { opacity: .5; font-size: 13px; }
.languageSwitch button { padding: 7px 2px; border: 0; background: none; font-size: 13px; color: inherit; opacity: .55; font-weight: 450; cursor: pointer; }
.languageSwitch button[aria-pressed='true'] { opacity: 1; font-weight: 700; }
.languageSwitch button:hover { opacity: 1; }
.nav.menu-is-open { mix-blend-mode: normal; background: #f7f9f7; }
.nav.menu-is-open .brand strong, .nav.menu-is-open .brand strong span, .nav.menu-is-open .languageSwitch, .nav.menu-is-open .islandMenuButton { color: #152a2b; }
.anchorAlias { position: absolute; top: 0; left: 0; }
.capabilities, .agencySection, .faqSection { scroll-margin-top: 105px; }
@media (max-width: 1020px) { .navlinks { gap: 23px; } .headerActions { gap: 18px; } }
@media (max-width: 760px) and (min-width: 681px) { .nav { padding: 0 24px; } .fixedBrandMark { left: 24px; } .navlinks { gap: 17px; } .navlinks a { font-size: 13px; } .headerActions { gap: 13px; } .navcta { padding: 10px 13px; } }
@media (max-width: 680px) {
  body { padding-top: 68px; }
  .nav { height: 68px; padding: 0 18px; }
  .fixedBrandMark { top: 18px; left: 18px; width: 32px; height: 32px; }
  .brandSpacer { width: 32px; height: 32px; }
  .headerActions { gap: 18px; }
  .languageSwitch { gap: 6px; }
  .languageSwitch button { font-size: 13px; }
  .nav .islandMenuButton { color: #fff; border-color: #ffffff80; background: transparent; }
  .nav.menu-is-open .islandMenuButton { border-color: #dce3dd; }
  .nav .mobilemenu a { color: #304944; }
}

.nav .brand strong { visibility: hidden; }
.fixedBrandMark { width: auto; display: flex; align-items: center; gap: 10px; }
.fixedBrandMark > img { width: 38px; height: 38px; flex: none; }
.fixedBrandMark > strong { font-size: 22px; font-weight: 700; line-height: 1; letter-spacing: -.06em; color: #152a2b; }
.fixedBrandMark > strong > span { color: #766be1; }
.languageToggle { border: 0; background: transparent; padding: 8px 3px; color: #fff; font-size: 14px; font-weight: 550; cursor: pointer; }
.nav.menu-is-open .languageToggle { color: #152a2b; }
.linkIcon { width: 18px; height: 18px; display: inline-block; vertical-align: middle; flex: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.navcta { display: inline-flex; align-items: center; gap: 10px; }
.cardLink { display: inline-flex; align-items: center; gap: 9px; }
.cardLink b { margin-left: 0; display: inline-flex; }
.module-card, .intelligenceSection { scroll-margin-top: 110px; }
footer.site-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; max-width: 1210px; padding: 62px 34px 28px; align-items: start; }
.footerIdentity .brand img { width: 48px; height: 48px; }
.footerIdentity .brand strong { font-size: 32px; }
.footerContact { justify-self: end; }
.footerContact > p { margin: 0 0 13px; color: #788b7c; font-size: 16px; }
.footerContact > a { display: inline-flex; align-items: center; gap: 15px; color: #2f493b; text-decoration: none; font-size: 27px; letter-spacing: -.025em; }
.mailIcon { width: 23px; height: 23px; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cardMascot { position: absolute; width: 110px; height: 110px; object-fit: contain; right: 18px; bottom: 16px; pointer-events: none; }
.intelligenceCard > p.sampleNote { padding-right: 110px; min-height: 90px; display: flex; align-items: end; }
.faqHeading { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-bottom: 24px; }
.faqHeading h2 { font-size: clamp(35px, 3.8vw, 53px); line-height: 1.08; letter-spacing: -.055em; font-weight: 600; margin: 0; }
.faqHeading > img { width: 108px; height: 108px; object-fit: contain; flex: none; }
.footerBottom { grid-column: 1 / -1; padding-top: 24px; margin-top: 30px; border-top: 1px solid #e1e7db; font-size: 14px; color: #889780; }
@media (max-width: 680px) {
  .fixedBrandMark > img { width: 32px; height: 32px; }
  .fixedBrandMark > strong { font-size: 20px; }
  .languageToggle { font-size: 14px; padding: 8px 3px; }
  .headerActions { gap: 21px; }
  .nav .navcta { display: none; }
  footer.site-footer { grid-template-columns: 1fr; gap: 25px; padding: 43px 20px 27px; }
  .footerIdentity .brand img { width: 42px; height: 42px; }
  .footerIdentity .brand strong { font-size: 29px; }
  .footerContact { justify-self: start; }
  .footerContact > a { font-size: clamp(22px, 6vw, 27px); gap: 11px; }
  .footerBottom { margin-top: 12px; padding-top: 22px; }
  .cardMascot { width: 90px; height: 90px; right: 13px; bottom: 14px; }
  .intelligenceCard > p.sampleNote { padding-right: 85px; min-height: 85px; }
  .faqHeading h2 { font-size: 37px; }
  .faqHeading > img { width: 88px; height: 88px; }
}