/* Ross Developer V11 - all-white spatial edition */

@font-face {
  font-family: "Audiowide";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/audiowide-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Exo 2";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/exo2-latin.woff2") format("woff2");
}

.v11-white-3d {
  --v11-font: "Exo 2", "Segoe UI", system-ui, -apple-system, sans-serif;
  --v11-display-font: "Audiowide", "Exo 2", system-ui, sans-serif;
  --v11-accent: #EA580C;
  --v11-accent-deep: #C6530B;
  --v11-accent-surface: #C94F00;
  --v11-accent-soft: #FFF2E9;
  --v11-bg: #FFFFFF;
  --v11-alt: #FFFFFF;
  --v11-surface: #FFFFFF;
  --v11-surface-hover: #FFFFFF;
  --v11-ink: #171717;
  --v11-muted: #555555;
  --v11-faint: #6B6B6B;
  --v11-line: #D8D8D8;
  --v11-line-strong: #AAAAAA;
  --v2-white: var(--v11-alt);
  --v2-ink: var(--v11-ink);
  --v2-black: var(--v11-ink);
  --v2-hover: #303030;
  --v2-soft: var(--v11-surface);
  --v2-line: var(--v11-line);
  --v2-muted: var(--v11-muted);
  background: var(--v11-bg) !important;
  color: var(--v11-ink) !important;
  accent-color: var(--v11-accent);
  color-scheme: light;
  font-family: var(--v11-font) !important;
}

.v11-white-3d :is(h1, h2, h3, h4, h5, h6, p, a, button, input, textarea, select, label, span, small, strong, em, li, blockquote) {
  font-family: var(--v11-font) !important;
}

/* V11 owns its reveal motion. Neutralize the legacy section-fade gate so
   content stays visible if an observer is delayed or interrupted. */
.v11-white-3d .section-fade {
  opacity: 1;
  transform: none;
  transition: none;
}

.v11-white-3d :is(.hero-h1, .section-header h2, .problem-intro h2, .work-header h2, .chatbot-title, .about h2, .leadmag-title, .faq-section h2, .contact h2, .v11-system-stage h3, .v11-intro-name, .nav-text) {
  font-family: var(--v11-display-font) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

.v11-white-3d :is(a, button, input, textarea, select):focus-visible {
  outline: 2px solid var(--v11-accent) !important;
  outline-offset: 3px;
}

html:has(.v11-white-3d) {
  background: #FFFFFF;
}

.v11-white-3d ::selection {
  background: var(--v11-accent);
  color: var(--v11-bg);
}

/* First-load brand intro. It is self-contained and removed after the reveal. */
.v11-white-3d .v11-intro {
  position: fixed;
  inset: 0;
  z-index: 400;
  display: grid;
  min-height: 100vh;
  min-height: 100dvh;
  padding: max(1.5rem, env(safe-area-inset-top)) max(1.5rem, env(safe-area-inset-right)) max(1.5rem, env(safe-area-inset-bottom)) max(1.5rem, env(safe-area-inset-left));
  place-items: center;
  overflow: hidden;
  overscroll-behavior: none;
  touch-action: none;
  background: #080808;
  color: #FFFFFF;
  clip-path: inset(0);
  isolation: isolate;
  animation: v11IntroFailsafe .01s linear 4s forwards;
  will-change: clip-path, opacity;
}

.v11-white-3d .v11-intro-inner {
  width: min(100%, 28rem);
  text-align: center;
  transition: opacity .38s ease, transform .56s cubic-bezier(.22, 1, .36, 1), filter .38s ease;
}

.v11-white-3d .v11-intro-mark {
  position: relative;
  width: clamp(6rem, 10vw, 7.5rem);
  aspect-ratio: 1;
  margin: 0 auto 1.45rem;
  opacity: 0;
  transform: translateY(12px) scale(.92);
  animation: v11IntroMarkIn .65s .08s cubic-bezier(.22, 1, .36, 1) forwards;
}

.v11-white-3d .v11-intro-mark::after {
  content: '';
  position: absolute;
  inset: -.55rem;
  border: 1px solid rgba(249, 115, 22, .72);
  border-radius: 50%;
  opacity: 0;
  transform: scale(.82);
  animation: v11IntroRingIn .9s .22s cubic-bezier(.22, 1, .36, 1) forwards;
}

.v11-white-3d .v11-intro-mark img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 0;
  object-fit: cover;
  object-position: center;
  transform: scale(1.16);
}

.v11-white-3d .v11-intro-name,
.v11-white-3d .v11-intro-tagline {
  margin: 0;
  opacity: 0;
  letter-spacing: 0;
  transform: translateY(8px);
  animation: v11IntroCopyIn .5s cubic-bezier(.22, 1, .36, 1) forwards;
}

.v11-white-3d .v11-intro-name {
  color: #FFFFFF;
  font-size: clamp(1.25rem, 2.2vw, 1.65rem);
  font-weight: 600;
  line-height: 1.2;
  animation-delay: .2s;
}

.v11-white-3d .v11-intro-tagline {
  margin-top: .55rem;
  color: #A9A9A9;
  font-size: clamp(.82rem, 1.1vw, .95rem);
  font-weight: 400;
  line-height: 1.55;
  animation-delay: .3s;
}

.v11-white-3d .v11-intro.is-leaving {
  opacity: .98;
  clip-path: inset(0 0 100% 0);
  pointer-events: none;
  animation: none;
  transition: clip-path .54s cubic-bezier(.76, 0, .24, 1), opacity .42s ease;
}

.v11-white-3d .v11-intro.is-leaving .v11-intro-inner {
  opacity: 0;
  filter: blur(3px);
  transform: translateY(-10px) scale(.985);
}

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

@keyframes v11IntroRingIn {
  55% { opacity: .58; }
  to { opacity: .24; transform: scale(1.12); }
}

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

@keyframes v11IntroFailsafe {
  to { opacity: 0; visibility: hidden; pointer-events: none; }
}

.v11-white-3d .site-3d-canvas {
  position: fixed;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  opacity: 0;
  filter: grayscale(1) contrast(1.1);
  mix-blend-mode: normal;
  transition: opacity .8s cubic-bezier(.22, 1, .36, 1);
}

.v11-white-3d .site-3d-canvas.is-ready {
  opacity: .66;
}

.v11-white-3d .site-3d-canvas.is-ready.is-content-depth {
  opacity: .38;
}

.v11-white-3d nav {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 220;
}

.v11-white-3d nav.menu-open {
  z-index: 300;
}

.v11-white-3d :is(header, section, footer) {
  position: relative;
  z-index: auto;
}

.v11-white-3d :is(header, section, footer) > * {
  position: relative;
  z-index: 2;
}

.v11-white-3d :is(.back-to-top, .chat-fab-wrap, .chat-window, .cookie-banner) {
  z-index: 210;
}

/* Navigation */
.v11-white-3d nav,
.v11-white-3d nav.scrolled {
  background: #FFFFFF !important;
  border-bottom-color: var(--v11-line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.v11-white-3d :is(.nav-logo, .nav-logo-text, .nav-text, .nav-links > a:not(.nav-cta-link):not(.nav-wa-btn), .nav-tagline, #menu-toggle) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .nav-tagline,
.v11-white-3d .nav-links > a:not(.nav-cta-link):not(.nav-wa-btn) {
  color: var(--v11-muted) !important;
}

.v11-white-3d .nav-links > a:not(.nav-cta-link):not(.nav-wa-btn):hover {
  color: var(--v11-accent-deep) !important;
}

.v11-white-3d .logo-img {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0;
  object-fit: cover;
  object-position: center;
  filter: none;
  transform: scale(1.08);
}

.v11-white-3d :is(.nav-cta-link, .nav-wa-btn),
.v11-white-3d :is(.nav-cta-link, .nav-wa-btn):hover {
  background: var(--v11-ink) !important;
  border-color: var(--v11-ink) !important;
  color: var(--v11-bg) !important;
  box-shadow: none !important;
}

.v11-white-3d :is(.nav-cta-link, .nav-wa-btn):hover {
  background: var(--v11-accent) !important;
  border-color: var(--v11-accent) !important;
  color: #FFFFFF !important;
}

.v11-white-3d #nav-menu.active {
  background: #FFFFFF !important;
}

.v11-white-3d #nav-menu.active > a:not(.nav-cta-link),
.v11-white-3d #nav-menu.active .menu-footer :is(a, .m-sep) {
  color: var(--v11-ink) !important;
}

@media (min-width: 1024px) {
  .v11-white-3d .nav-container {
    height: 76px;
  }

  .v11-white-3d .nav-links {
    display: flex;
    gap: clamp(.7rem, 1.15vw, 1.3rem);
  }

  .v11-white-3d .nav-links > a:not(.nav-wa-btn) {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    font-family: var(--v11-display-font) !important;
    font-size: clamp(.62rem, .66vw, .72rem);
    font-weight: 400;
    white-space: nowrap;
  }

  .v11-white-3d .nav-cta-link {
    padding: .65rem .9rem;
    border-radius: 8px;
  }

  .v11-white-3d .nav-mobile-wrapper,
  .v11-white-3d #menu-toggle,
  .v11-white-3d .menu-footer {
    display: none !important;
  }
}

/* Pure-white sections; the canvas sits above their background and below content. */
.v11-white-3d :is(.hero, .problema, .services, .method, .work, .chatbot-section, .about, .reviews, .leadmag, .faq-section, .contact, footer) {
  background: #FFFFFF !important;
  color: var(--v11-ink) !important;
  border-color: var(--v11-line) !important;
}

.v11-white-3d :is(.problema, .method, .chatbot-section, .reviews, .leadmag, .faq-section, footer) {
  background: #FFFFFF !important;
}

.v11-white-3d :is(.hero, .problema, .services, .method, .work, .chatbot-section, .about, .reviews, .leadmag, .faq-section, .contact)::before,
.v11-white-3d :is(.hero, .problema, .services, .method, .work, .chatbot-section, .about, .reviews, .leadmag, .faq-section, .contact)::after {
  background-image: none !important;
}

.v11-white-3d :is(.section-header h2, .problem-intro h2, .services h2, .method h2, .work h2, .chatbot-title, .about h2, .reviews h2, .leadmag-title, .faq-section h2, .contact h2),
.v11-white-3d :is(.section-header h2, .problem-intro h2, .services h2, .method h2, .work h2, .chatbot-title, .about h2, .reviews h2, .leadmag-title, .faq-section h2, .contact h2) em {
  color: var(--v11-ink) !important;
}

.v11-white-3d :is(.section-sub, .problem-intro > p, .method .section-sub, .work-sub, .chatbot-sub, .about-text p, .leadmag-sub, .contact-sub) {
  color: var(--v11-muted) !important;
}

/* Hero */
.v11-white-3d .hero {
  min-height: 100vh;
  overflow: hidden;
  box-shadow: inset 0 -1px 0 var(--v11-line) !important;
}

.v11-white-3d .hero::after {
  display: none !important;
}

.v11-white-3d .hero-grid {
  position: relative;
  z-index: 1;
}

.v11-white-3d .hero-content {
  background: transparent !important;
}

.v11-white-3d :is(.h1-light, .h1-bold) {
  font-family: var(--v11-display-font) !important;
  font-weight: 400 !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d .h1-bold {
  color: var(--v11-accent) !important;
}

.v11-white-3d .h1-bold::after {
  width: clamp(4.5rem, 9vw, 7rem);
  height: 3px;
  background: var(--v11-accent) !important;
  opacity: 1;
}

.v11-white-3d .hero-subtitle {
  color: var(--v11-muted) !important;
  text-shadow: 0 0 10px rgba(255, 255, 255, .98), 0 0 24px rgba(255, 255, 255, .9);
}

.v11-white-3d .hero-image-frame {
  background: var(--v11-surface) !important;
  outline-color: var(--v11-line) !important;
}

.v11-white-3d .hero-image-frame picture {
  display: block;
  width: 100%;
  height: 100%;
}

.v11-white-3d .hero-image-frame img {
  filter: saturate(.8) contrast(1.06);
}

.v11-white-3d :is(.btn-hero-main, .btn-prob-cta, .service-panel-cta, .chatbot-section .btn-cta-primary, .about .btn-cta-primary, .work-cta-inner .btn-cta-primary, .lm-submit, .form-submit, .cookie-accept) {
  background: var(--v11-ink) !important;
  border-color: var(--v11-ink) !important;
  color: var(--v11-bg) !important;
}

.v11-white-3d :is(.btn-hero-main, .btn-prob-cta, .service-panel-cta, .chatbot-section .btn-cta-primary, .about .btn-cta-primary, .work-cta-inner .btn-cta-primary, .lm-submit, .form-submit, .cookie-accept):hover {
  background: var(--v11-accent) !important;
  border-color: var(--v11-accent) !important;
  color: #FFFFFF !important;
}

.v11-white-3d :is(.btn-hero-ghost, .btn-cta-ghost) {
  color: var(--v11-ink) !important;
  border-bottom-color: var(--v11-ink) !important;
}

.v11-white-3d :is(.btn-hero-ghost, .btn-cta-ghost):hover {
  color: var(--v11-accent-deep) !important;
  border-bottom-color: var(--v11-accent) !important;
}

/* Problem */
.v11-white-3d .problem-signals,
.v11-white-3d .problem-signal {
  border-color: var(--v11-line-strong) !important;
}

.v11-white-3d .problem-signals {
  border-top-color: var(--v11-accent) !important;
}

.v11-white-3d .problem-signal h3 {
  color: var(--v11-ink) !important;
}

.v11-white-3d .problem-signal p {
  color: var(--v11-ink) !important;
}

/* Services */
.v11-white-3d .services-studio {
  border-color: var(--v11-line) !important;
  background: transparent !important;
}

.v11-white-3d .v11-system-anchor {
  background: var(--v11-accent-surface) !important;
  border-color: rgba(255, 255, 255, .28) !important;
  color: #FFFFFF !important;
}

.v11-white-3d .v11-system-anchor > p,
.v11-white-3d .v11-system-anchor .v11-system-cta,
.v11-white-3d .v11-system-anchor .v11-system-cta span {
  color: #FFFFFF !important;
}

.v11-white-3d .v11-system-anchor .v11-system-cta {
  border-bottom-color: rgba(255, 255, 255, .76) !important;
}

.v11-white-3d .v11-system-anchor .v11-system-cta:hover {
  border-bottom-color: #FFFFFF !important;
}

.v11-white-3d .service-tabs {
  border-color: var(--v11-line) !important;
  background: #FFFFFF !important;
}

.v11-white-3d .service-tab,
.v11-white-3d .service-tab:last-child {
  background: transparent !important;
  border-color: var(--v11-line) !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d .service-tab :is(span, small) {
  color: inherit !important;
}

.v11-white-3d .service-tab small {
  color: var(--v11-faint) !important;
}

.v11-white-3d .service-tab:hover,
.v11-white-3d .service-tab.is-active {
  background: var(--v11-surface) !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d .service-tab.is-active {
  box-shadow: inset 0 -3px 0 var(--v11-ink) !important;
}

.v11-white-3d .service-tab {
  transition: color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .2s cubic-bezier(.22, 1, .36, 1) !important;
}

.v11-white-3d .service-panel.is-active {
  animation: v11PanelIn .34s cubic-bezier(.22, 1, .36, 1) both !important;
}

.v11-white-3d .service-stage {
  background: #FFFFFF !important;
  border: 1px solid var(--v11-line) !important;
  border-top: 0 !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d .service-panel h3,
.v11-white-3d .service-panel-list li {
  color: var(--v11-ink) !important;
}

.v11-white-3d .service-panel > p:not(.service-panel-signal) {
  color: var(--v11-muted) !important;
}

.v11-white-3d .service-panel-list li {
  border-color: var(--v11-line-strong) !important;
}

/* Method */
.v11-white-3d :is(.method-flow, .method-step) {
  border-color: var(--v11-line-strong) !important;
}

.v11-white-3d .method-flow::before {
  background: var(--v11-accent) !important;
}

.v11-white-3d .method-step h3 {
  color: var(--v11-ink) !important;
}

.v11-white-3d .method-step p {
  color: var(--v11-muted) !important;
}

/* Work */
.v11-white-3d .work :is(h2, h3, p) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .work-info span,
.v11-white-3d .work-desc {
  color: var(--v11-muted) !important;
}

.v11-white-3d .zoom-frame,
.v11-white-3d .work-cta-inner,
.v11-white-3d .work-cta-card:hover .work-cta-inner {
  background: var(--v11-surface) !important;
  border-color: var(--v11-line) !important;
}

.v11-white-3d .work-overlay {
  background: rgba(5, 5, 5, .68) !important;
}

.v11-white-3d .work-cta-inner :is(h3, p),
.v11-white-3d .work-cta-icon {
  color: var(--v11-ink) !important;
}

/* Chatbot section */
.v11-white-3d .chatbot-section :is(.chatbot-title, .chatbot-feat-title) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .chatbot-section :is(.chatbot-sub, .chatbot-feat-desc) {
  color: var(--v11-muted) !important;
}

.v11-white-3d :is(.chatbot-features, .chatbot-feat) {
  border-color: var(--v11-line-strong) !important;
}

.v11-white-3d .chatbot-feat-icon {
  background: var(--v11-surface) !important;
  border-color: var(--v11-line) !important;
  color: var(--v11-ink) !important;
}

/* About and reviews */
.v11-white-3d .about :is(h2, p) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .about-text p {
  color: var(--v11-muted) !important;
}

.v11-white-3d .about-image-frame,
.v11-white-3d .about-principle {
  background: var(--v11-surface) !important;
  border-color: var(--v11-line) !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d .review-card,
.v11-white-3d .review-card:hover {
  background: #FFFFFF !important;
  border-color: var(--v11-line) !important;
  box-shadow: none !important;
}

.v11-white-3d .review-card :is(.review-text, .review-name) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .review-card .review-role {
  color: var(--v11-muted) !important;
}

.v11-white-3d :is(.review-stars, .review-avatar) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .review-stars {
  color: var(--v11-accent) !important;
}

.v11-white-3d .review-avatar {
  background: var(--v11-surface-hover) !important;
  border-color: var(--v11-line-strong) !important;
}

.v11-white-3d .review-quote {
  color: var(--v11-line-strong) !important;
}

/* Lead magnet */
.v11-white-3d .leadmag :is(.leadmag-title, .check-list li) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .leadmag :is(.leadmag-sub, .lm-privacy) {
  color: var(--v11-muted) !important;
}

.v11-white-3d .check-list svg {
  stroke: var(--v11-accent) !important;
}

.v11-white-3d .lm-input {
  background: var(--v11-bg) !important;
  border-color: var(--v11-line-strong) !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d .leadmag-form {
  background: var(--v11-accent-surface) !important;
  border-color: var(--v11-accent-surface) !important;
}

.v11-white-3d .leadmag-form :is(h3, p, .lm-privacy, .lm-privacy svg) {
  color: #FFFFFF !important;
}

.v11-white-3d .leadmag-form .lm-input {
  background: #FFFFFF !important;
  border-color: rgba(255, 255, 255, .82) !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d .leadmag-form .lm-submit:hover {
  background: #FFFFFF !important;
  border-color: #FFFFFF !important;
  color: var(--v11-ink) !important;
}

/* FAQ */
.v11-white-3d .faq-item,
.v11-white-3d .faq-item:first-child {
  border-color: var(--v11-line-strong) !important;
}

.v11-white-3d :is(.faq-q, .faq-a p, .faq-icon, .faq-item.open .faq-icon) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .faq-a p {
  color: var(--v11-muted) !important;
}

/* Contact */
.v11-white-3d .contact :is(h2, h3, p, a, label) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .contact .contact-sub {
  color: var(--v11-muted) !important;
}

.v11-white-3d :is(.step-dot, .chip, .form-next, .social-icon, .back-to-top) {
  background: var(--v11-surface) !important;
  border-color: var(--v11-line-strong) !important;
  color: var(--v11-ink) !important;
  box-shadow: none !important;
}

.v11-white-3d :is(.step-dot.active, .step-dot.done, .chip.selected),
.v11-white-3d :is(.chip, .form-next, .social-icon, .back-to-top):hover {
  background: var(--v11-accent) !important;
  border-color: var(--v11-accent) !important;
  color: #FFFFFF !important;
}

.v11-white-3d :is(.step-line, .form-progress) {
  background: var(--v11-line) !important;
}

.v11-white-3d :is(.step-line.done, .progress-bar) {
  background: var(--v11-accent) !important;
}

.v11-white-3d .form-group :is(input, textarea) {
  background: var(--v11-surface) !important;
  border-color: var(--v11-line-strong) !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d :is(.form-group input, .form-group textarea, .lm-input, .chat-input)::placeholder {
  color: var(--v11-faint) !important;
  opacity: 1;
}

.v11-white-3d .form-group :is(input, textarea):focus {
  border-color: var(--v11-ink) !important;
  box-shadow: 0 0 0 3px rgba(23, 23, 23, .1) !important;
}

.v11-white-3d :is(.contact-divider, .contact-email) {
  color: var(--v11-muted) !important;
}

.v11-white-3d .contact-divider::before,
.v11-white-3d .contact-divider::after {
  background: var(--v11-line) !important;
}

/* Orange occupies two complete conversion moments: useful contrast, not decoration. */
.v11-white-3d .chatbot-section,
.v11-white-3d .contact {
  background: var(--v11-accent-surface) !important;
  color: #FFFFFF !important;
  border-color: rgba(255, 255, 255, .32) !important;
}

.v11-white-3d .chatbot-section :is(.chatbot-title, .chatbot-sub, .chatbot-feat-title, .chatbot-feat-desc),
.v11-white-3d .contact .section-header :is(h2, .contact-sub),
.v11-white-3d .contact :is(.contact-divider, .contact-email) {
  color: #FFFFFF !important;
}

.v11-white-3d .chatbot-section .chatbot-features {
  border-color: rgba(255, 255, 255, .58) !important;
}

.v11-white-3d .chatbot-section .chatbot-feat {
  border-color: rgba(255, 255, 255, .38) !important;
}

.v11-white-3d .chatbot-section .chatbot-feat-icon {
  background: rgba(255, 255, 255, .12) !important;
  border-color: rgba(255, 255, 255, .55) !important;
  color: #FFFFFF !important;
}

.v11-white-3d .chatbot-section .btn-cta-primary {
  background: #FFFFFF !important;
  border-color: #FFFFFF !important;
  color: var(--v11-accent-deep) !important;
}

.v11-white-3d .chatbot-section .btn-cta-primary:hover {
  background: var(--v11-ink) !important;
  border-color: var(--v11-ink) !important;
  color: #FFFFFF !important;
}

.v11-white-3d .contact-form-wrapper {
  padding: clamp(1.5rem, 3vw, 2.5rem) !important;
  border: 1px solid rgba(255, 255, 255, .55);
  border-radius: 12px;
  background: #FFFFFF;
}

.v11-white-3d .contact .contact-form-wrapper :is(h2, h3, p, a, label) {
  color: var(--v11-ink) !important;
}

.v11-white-3d .contact-divider::before,
.v11-white-3d .contact-divider::after {
  background: rgba(255, 255, 255, .52) !important;
}

.v11-white-3d .contact .contact-email {
  opacity: 1;
}

.v11-white-3d .contact .social-icon {
  background: #FFFFFF !important;
  border-color: #FFFFFF !important;
  color: var(--v11-accent-deep) !important;
}

.v11-white-3d .contact .social-icon:hover {
  background: var(--v11-ink) !important;
  border-color: var(--v11-ink) !important;
  color: #FFFFFF !important;
}

@media (hover: hover) and (pointer: fine) {
  .v11-white-3d :is(.btn-hero-main, .btn-prob-cta, .service-panel-cta, .btn-cta-primary, .lm-submit, .form-submit, .cookie-accept) {
    transition: transform .2s cubic-bezier(.22, 1, .36, 1), background-color .2s ease, border-color .2s ease !important;
  }

  .v11-white-3d :is(.btn-hero-main, .btn-prob-cta, .service-panel-cta, .btn-cta-primary, .lm-submit, .form-submit, .cookie-accept):hover {
    transform: translateY(-2px);
  }

  .v11-white-3d :is(.btn-hero-main, .btn-prob-cta, .service-panel-cta, .btn-cta-primary, .lm-submit, .form-submit, .cookie-accept):active {
    transform: translateY(0) scale(.985);
  }

  .v11-white-3d .service-tab:hover {
    transform: translateY(-1px);
  }
}

/* Footer and floating UI */
.v11-white-3d footer {
  border-top-color: var(--v11-line) !important;
}

.v11-white-3d footer p,
.v11-white-3d .footer-tools :is(a, span) {
  color: var(--v11-muted) !important;
}

.v11-white-3d .chat-fab,
.v11-white-3d .chat-fab:hover {
  background: var(--v11-accent) !important;
  color: #FFFFFF !important;
  box-shadow: 0 10px 24px rgba(249, 115, 22, .24) !important;
}

.v11-white-3d .chat-fab-badge {
  background: var(--v11-accent) !important;
  border-color: var(--v11-bg) !important;
}

.v11-white-3d :is(.chat-window, .chat-header, .chat-msgs, .chat-quick, .chat-input-area, .chat-powered, .booking-btns) {
  background: var(--v11-bg) !important;
  border-color: var(--v11-line) !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d .chat-window {
  box-shadow: 0 20px 48px rgba(0, 0, 0, .2) !important;
}

.v11-white-3d .chat-header :is(h4, p, span, button),
.v11-white-3d .chat-close {
  color: var(--v11-ink) !important;
}

.v11-white-3d .chat-online-dot {
  background: var(--v11-ink) !important;
}

.v11-white-3d :is(.chat-msg.bot, .chat-msg.usr, .quick-btn, .chat-input) {
  background: var(--v11-surface) !important;
  border-color: var(--v11-line-strong) !important;
  color: var(--v11-ink) !important;
}

.v11-white-3d :is(.quick-btn:last-child, .booking-btn, .chat-send) {
  background: var(--v11-ink) !important;
  border-color: var(--v11-ink) !important;
  color: var(--v11-bg) !important;
}

.v11-white-3d .chat-powered {
  color: var(--v11-faint) !important;
}

.v11-white-3d .cookie-banner {
  background: #FFFFFF !important;
  border-top-color: var(--v11-line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(16px);
}

.v11-white-3d :is(.cookie-text p, .cookie-policy, .cookie-text svg) {
  color: var(--v11-muted) !important;
}

@media (max-width: 767px) {
  .v11-white-3d .back-to-top {
    display: none !important;
  }

  .v11-white-3d .hero {
    background: #FFFFFF !important;
    min-height: 0 !important;
  }

  .v11-white-3d .hero-content {
    background: transparent !important;
    padding: 5.25rem 1.25rem 1.25rem !important;
    min-width: 0;
    overflow: hidden;
  }

  .v11-white-3d .hero-h1 {
    width: 100%;
    max-width: 100%;
  }

  .v11-white-3d :is(.h1-light, .h1-bold) {
    max-width: 100%;
    font-size: clamp(1.42rem, 6.2vw, 1.72rem) !important;
    line-height: 1.14 !important;
    overflow-wrap: anywhere;
    text-wrap: balance;
  }

  .v11-white-3d .hero-subtitle {
    width: 100%;
    max-width: min(36ch, calc(100vw - 2.5rem)) !important;
    margin-inline: auto;
    font-size: .96rem !important;
    line-height: 1.68 !important;
    overflow-wrap: anywhere;
  }

  .v11-white-3d :is(.cookie-content, .cookie-text, .cookie-text p, .cookie-btns) {
    min-width: 0;
    max-width: 100%;
  }

  .v11-white-3d .cookie-banner {
    width: 100vw;
    overflow: hidden;
    padding-inline: 1rem !important;
  }

  .v11-white-3d .cookie-content {
    width: calc(100vw - 2rem) !important;
  }

  .v11-white-3d .cookie-text {
    width: calc(100vw - 2rem) !important;
    grid-template-columns: 18px minmax(0, 1fr) !important;
  }

  .v11-white-3d .cookie-text p {
    width: auto;
    max-width: calc(100vw - 4.75rem) !important;
    overflow-wrap: anywhere;
  }

  .v11-white-3d .cookie-btns {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .v11-white-3d .cookie-policy {
    justify-self: center;
    white-space: normal;
  }

  .v11-white-3d .hero-image {
    width: calc(100% - 2rem) !important;
    height: 210px !important;
    min-height: 0 !important;
    margin: 0 1rem 1.5rem !important;
  }

  .v11-white-3d .hero-image-frame {
    width: 100% !important;
    height: 100% !important;
  }

  .v11-white-3d .hero-image-frame img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 28% !important;
  }

  .v11-white-3d .service-tab.is-active {
    box-shadow: inset 3px 0 0 var(--v11-ink) !important;
  }

  .v11-white-3d .method-step,
  .v11-white-3d .method-step:nth-child(2n) {
    border-bottom-color: var(--v11-line-strong) !important;
  }

  .v11-white-3d .problem-signal h3 {
    max-width: 20ch !important;
    margin-inline: auto !important;
    overflow-wrap: anywhere;
    text-wrap: balance;
  }

  .v11-white-3d .problem-signal p {
    max-width: 34ch !important;
    margin-inline: auto !important;
    overflow-wrap: anywhere;
    text-wrap: pretty;
  }

  .v11-white-3d .site-3d-canvas.is-ready {
    opacity: .5;
  }

  .v11-white-3d .site-3d-canvas.is-ready.is-content-depth {
    opacity: .28;
  }

}

@media (hover: none), (pointer: coarse) {
  .v11-white-3d :is(.mob-hero-orb-1, .mob-hero-orb-2, .mob-dark-orb) {
    display: none !important;
  }

  .v11-white-3d :is(.work-item, .review-card, .service-card, .service-icon, .section-header h2, .work-header h2, .chatbot-title, .leadmag-title) {
    animation: none;
  }

}

@media (prefers-reduced-motion: reduce) {
  .v11-white-3d .v11-intro {
    transition-duration: .01ms !important;
  }

  .v11-white-3d .v11-intro * {
    animation: none !important;
    transition-duration: .01ms !important;
  }

  .v11-white-3d .v11-intro-mark,
  .v11-white-3d .v11-intro-name,
  .v11-white-3d .v11-intro-tagline {
    opacity: 1;
    transform: none;
  }

  .v11-white-3d .site-3d-canvas {
    transition: none;
  }

  .v11-white-3d .site-3d-canvas.is-ready {
    opacity: .42;
  }

  .v11-white-3d .site-3d-canvas.is-ready.is-content-depth {
    opacity: .3;
  }

  .v11-white-3d .service-panel.is-active {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ── FIX HERO: TESTO GRANDE MA MAI COPERTO ──────────────────
   Le misure display restano quelle originali (grandi).
   Il taglio era causato da .hero-content { height: 100vh } su
   desktop: col titolo in Audiowide il contenuto supera il box
   fisso, viene centrato e la parte alta finisce dietro la
   navbar fissa. Qui il box diventa elastico: cresce col
   contenuto e parte sotto la navbar, niente più clipping. */
@media (min-width: 1024px) {
  .v11-white-3d .hero-content {
    height: auto !important;
    min-height: 100vh;
    padding-top: 7.5rem !important;
    padding-bottom: 3rem !important;
  }
  .v11-white-3d .hero-image {
    height: auto !important;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: calc(64px + 2rem) 3.5rem 2rem 1.5rem !important;
  }
  /* Foto leggermente ridotta: respira nel bianco invece di riempire la colonna */
  .v11-white-3d .hero-image-frame {
    height: min(72vh, 100%);
    width: 100%;
  }
}

/* Riga di fiducia sotto le CTA hero: prova sociale + rischio zero */
.v11-white-3d .hero-trust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .6rem;
  margin: -.9rem 0 1.8rem;
  font-size: .78rem;
  color: var(--v11-muted);
}
.v11-white-3d .hero-trust-stars {
  color: var(--v11-accent);
  font-size: .82rem;
  letter-spacing: .14em;
}