/* Nanobanana layout contract — the single authoritative responsive layer. */
:root {
  --nb-header-h: 64px;
  --nb-container: 1120px;
  --nb-gutter: clamp(16px, 2.4vw, 30px);
  --nb-section-gap: 24px;
  --nb-panel-pad: clamp(20px, 2.6vw, 30px);
  --nb-radius: 24px;
  --nb-card-radius: 18px;
  --nb-bg: #15140f;
  --nb-panel: #1d1b15;
  --nb-panel-2: #242118;
  --nb-line: rgba(245, 194, 54, .28);
  --nb-text: #fffaf0;
  --nb-muted: #bdb6a6;
  --nb-yellow: #ffd04f;
  --nb-orange: #ff9b3d;
}

html { scroll-padding-top: calc(var(--nb-header-h) + 16px); }
body {
  padding-top: calc(var(--nb-header-h) + 12px) !important;
  overflow-x: clip !important;
  background-color: var(--nb-bg) !important;
}

body .header,
body .site-header {
  position: fixed !important;
  inset: 0 auto auto 50% !important;
  transform: translateX(-50%) !important;
  z-index: 1000 !important;
  width: min(calc(100% - 24px), var(--nb-container)) !important;
  height: var(--nb-header-h) !important;
  min-height: var(--nb-header-h) !important;
  margin: 0 !important;
  padding: 0 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  border: 1px solid var(--nb-line) !important;
  border-top: 0 !important;
  border-radius: 0 0 16px 16px !important;
  background: rgba(18, 17, 13, .94) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.2) !important;
}

body .logo {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  color: var(--nb-text) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-transform: lowercase !important;
}
body .logo img,
body .logo__mark {
  width: 38px !important;
  height: 38px !important;
  flex: 0 0 38px !important;
  object-fit: contain !important;
}

body main,
body .landing-main { min-width: 0 !important; }
body main > section,
body .landing-main > section,
body > .footer,
body > footer {
  box-sizing: border-box !important;
  width: min(calc(100% - (var(--nb-gutter) * 2)), var(--nb-container)) !important;
  max-width: var(--nb-container) !important;
  margin: 0 auto var(--nb-section-gap) !important;
  min-height: 0 !important;
  transform: none !important;
}

body h1,
body .hero h1,
body .landing-hero h1 {
  margin: 0 !important;
  font-size: 44px !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
  text-wrap: balance !important;
}
body h2,
body .section-heading h2,
body .landing-section__heading h2,
body .landing-proof__heading h2,
body .landing-demo__heading h2 {
  margin: 0 !important;
  font-size: 36px !important;
  line-height: 1.06 !important;
  letter-spacing: -.035em !important;
  text-wrap: balance !important;
}
body h3 { line-height: 1.15 !important; text-wrap: balance !important; }
body p { line-height: 1.55 !important; }

body .button,
body .btn,
body button,
body a[class*="button"] {
  min-height: 46px !important;
  padding: 0 20px !important;
  border-radius: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  line-height: 1.1 !important;
  text-align: center !important;
  transition: transform .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}
body .button:hover,
body .btn:hover,
body button:hover,
body a[class*="button"]:hover { transform: scale(1.05) !important; z-index: 2; }
body .button:active,
body .btn:active,
body button:active,
body a[class*="button"]:active { transform: scale(.95) !important; }
body :focus-visible { outline: 3px solid #fff !important; outline-offset: 3px !important; }

body .hero,
body .landing-hero {
  display: grid !important;
  grid-template-columns: minmax(0, 7fr) minmax(290px, 3fr) !important;
  grid-template-areas: "visual copy" !important;
  align-items: stretch !important;
  gap: 16px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}
body .hero__copy,
body .landing-hero__copy {
  grid-area: copy !important;
  min-width: 0 !important;
  padding: 28px 24px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 16px !important;
  border: 1px solid var(--nb-line) !important;
  border-radius: var(--nb-radius) !important;
  background: linear-gradient(145deg, rgba(39,36,25,.98), rgba(23,22,17,.98)) !important;
  text-align: left !important;
  overflow: hidden !important;
}
body .hero__visual,
body .landing-hero__visual {
  grid-area: visual !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  max-height: 520px !important;
  padding: 0 !important;
  border: 1px solid var(--nb-line) !important;
  border-radius: var(--nb-radius) !important;
  overflow: hidden !important;
  background: var(--nb-panel) !important;
}
body .hero__visual img,
body .landing-hero__visual img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
body .hero__description,
body .landing-hero__lead { margin: 0 !important; max-width: 38rem !important; color: var(--nb-muted) !important; }
body .hero__actions,
body .landing-hero__actions { margin: 0 !important; display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
body .hero__facts,
body .landing-value {
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  width: 100% !important;
}
body .hero__facts li,
body .landing-value li {
  min-width: 0 !important;
  min-height: 50px !important;
  padding: 10px 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  border: 1px solid var(--nb-line) !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.025) !important;
}
body .hero__facts svg,
body .landing-value svg {
  width: 24px !important;
  height: 24px !important;
  flex: 0 0 24px !important;
}
body .hero__facts strong,
body .landing-value strong {
  min-width: 0 !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
}

body .features,
body .studio,
body .faq,
body .closing,
body .landing-proof,
body .landing-steps,
body .landing-demo,
body .landing-uses,
body .landing-context,
body .landing-faq,
body .landing-section {
  padding: var(--nb-panel-pad) !important;
  border: 1px solid var(--nb-line) !important;
  border-radius: var(--nb-radius) !important;
  background: linear-gradient(145deg, rgba(30,29,23,.98), rgba(20,20,17,.98)) !important;
  overflow: hidden !important;
}
body .section-heading,
body .studio__heading,
body .landing-section__heading,
body .landing-proof__heading,
body .landing-demo__heading,
body .landing-uses__heading,
body .landing-context__heading {
  margin: 0 0 18px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(240px, .55fr) !important;
  align-items: end !important;
  gap: 18px !important;
}
body .section-label,
body .label,
body .eyebrow,
body .landing-label {
  width: max-content !important;
  max-width: 100% !important;
  margin: 0 0 12px !important;
  padding: 7px 12px !important;
  border-radius: 999px !important;
  background: var(--nb-yellow) !important;
  color: #17140d !important;
  box-shadow: 0 8px 20px rgba(255,208,79,.16) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

body .landing-proof__grid,
body .landing-uses__grid,
body .landing-context__grid,
body .features__grid,
body .principles__grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  align-items: stretch !important;
  gap: 12px !important;
}
body .landing-proof__card,
body .landing-uses__item,
body .landing-context__item,
body .feature-card,
body .principle-card {
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 18px !important;
  border: 1px solid var(--nb-line) !important;
  border-radius: var(--nb-card-radius) !important;
  background: var(--nb-panel-2) !important;
  overflow: hidden !important;
  transition: transform .2s ease, border-color .2s ease !important;
}
body .landing-proof__card:hover,
body .landing-uses__item:hover,
body .landing-context__item:hover,
body .feature-card:hover { transform: scale(1.03) !important; border-color: rgba(255,208,79,.6) !important; z-index: 2; }
body .landing-proof__media { margin: 16px -18px -18px !important; aspect-ratio: 4/3 !important; overflow: hidden !important; }
body .landing-proof__media img { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important; }

body .landing-steps {
  background: var(--nb-yellow) !important;
  color: #17140d !important;
  border-color: rgba(255,255,255,.2) !important;
}
body .landing-steps h2,
body .landing-steps p { color: #17140d !important; }
body .landing-steps__grid,
body .steps__grid { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 10px !important; }
body .landing-steps__item,
body .steps__item { min-height: 92px !important; padding: 18px !important; border: 1px solid rgba(23,20,13,.2) !important; border-radius: 16px !important; background: rgba(255,255,255,.2) !important; color: #17140d !important; }

body .landing-demo__workspace,
body .studio__workspace {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(240px,.8fr) minmax(0,1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}
body .landing-demo__media,
body .landing-demo__prompt,
body .studio__source,
body .studio__controls,
body .studio__result {
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 14px !important;
  border: 1px solid var(--nb-line) !important;
  border-radius: var(--nb-card-radius) !important;
  background: var(--nb-panel) !important;
  overflow: hidden !important;
}
body .studio__source,
body .studio__controls,
body .studio__result {
  background: #fffaf0 !important;
  color: #17140d !important;
  border-color: rgba(23, 20, 13, .18) !important;
}
body .studio__caption,
body .studio__controls > label,
body .studio__modes,
body .studio__modes legend,
body .studio__modes label {
  color: #17140d !important;
}
body .studio__controls textarea {
  background: #fff !important;
  color: #17140d !important;
  border-color: rgba(23, 20, 13, .72) !important;
}
body .studio__modes {
  border-color: rgba(23, 20, 13, .72) !important;
  background: rgba(255, 208, 79, .12) !important;
}
body .upload-button {
  color: #17140d !important;
  border-color: rgba(23, 20, 13, .72) !important;
  background: rgba(255,255,255,.72) !important;
}
body .upload-button:hover {
  background: var(--nb-yellow) !important;
}
body .landing-demo__media img,
body .studio__source img,
body .studio__result img { display:block !important; width:100% !important; height:auto !important; aspect-ratio: 4/5 !important; object-fit: cover !important; object-position:center !important; border-radius: 12px !important; }
body .landing-demo__prompt { display:flex !important; flex-direction:column !important; justify-content:center !important; gap:14px !important; }
body .landing-demo__prompt p { margin:0 !important; font-size: clamp(16px,1.6vw,20px) !important; line-height:1.35 !important; }

body .landing-context__note,
body .landing-proof__note,
body .section-note { margin:0 !important; padding:16px 18px !important; border:1px solid var(--nb-line) !important; border-radius:15px !important; background:var(--nb-panel-2) !important; color:var(--nb-muted) !important; }
body .faq,
body .landing-faq { padding: var(--nb-panel-pad) !important; }
body .faq__list { margin-top: 14px !important; }
body details { margin:0 !important; border:1px solid var(--nb-line) !important; border-radius:14px !important; background:var(--nb-panel-2) !important; overflow:hidden !important; }
body details + details { margin-top:8px !important; }
body details summary { min-height:50px !important; padding:14px 16px !important; display:flex !important; align-items:center !important; }
body details > :not(summary) { padding:0 16px 16px !important; }
body .closing,
body .landing-closing { min-height:0 !important; padding:22px 26px !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:20px !important; }
body .footer,
body footer { padding:24px !important; border:1px solid rgba(23,20,13,.12) !important; border-radius:var(--nb-radius) !important; }

body img { max-width:100% !important; }
body [class*="product"] img,
body [class*="card"] img[data-fit="contain"] { object-fit:contain !important; }

@media (max-width: 1023px) {
  :root { --nb-section-gap: 20px; }
  body .hero,
  body .landing-hero { grid-template-columns: 1fr !important; grid-template-areas:"copy" "visual" !important; }
  body .hero__visual,
  body .landing-hero__visual { max-height:none !important; aspect-ratio:16/10 !important; }
  body .landing-proof__grid,
  body .landing-uses__grid,
  body .landing-context__grid,
  body .features__grid,
  body .principles__grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}

@media (max-width: 767px) {
  :root { --nb-gutter: 14px; --nb-section-gap: 16px; --nb-panel-pad: 18px; --nb-radius: 20px; }
  body { padding-top: calc(var(--nb-header-h) + 8px) !important; }
  body .header,
  body .site-header { width:100% !important; border-radius:0 !important; padding:0 14px !important; }
  body .header nav:not(.header__actions--essential),
  body .site-header nav:not(.header__actions--essential),
  body .header .nav { display:none !important; }
  body .header .header__actions--essential,
  body .site-header .header__actions--essential {
    display:flex !important;
    align-items:center !important;
    margin-left:auto !important;
  }
  body .header .header__actions--essential > *,
  body .site-header .header__actions--essential > * { display:none !important; }
  body .header .header__actions--essential > .button:last-child,
  body .site-header .header__actions--essential > .button:last-child {
    min-height:40px !important;
    padding:0 14px !important;
    display:inline-flex !important;
    font-size:13px !important;
    white-space:nowrap !important;
  }
  body .logo { font-size:16px !important; gap:8px !important; }
  body .logo img,
  body .logo__mark { width:36px !important; height:36px !important; flex-basis:36px !important; }
  body h1,
  body .hero h1,
  body .landing-hero h1 { font-size:30px !important; line-height:1.04 !important; }
  body h2,
  body .section-heading h2,
  body .landing-section__heading h2,
  body .landing-proof__heading h2,
  body .landing-demo__heading h2 { font-size:26px !important; line-height:1.08 !important; }
  body .hero__copy,
  body .landing-hero__copy { padding:20px 18px !important; gap:13px !important; }
  body .hero__visual,
  body .landing-hero__visual { aspect-ratio:4/3 !important; }
  body .hero__actions,
  body .landing-hero__actions { width:100% !important; display:grid !important; grid-template-columns:1fr !important; }
  body .hero__actions > *,
  body .landing-hero__actions > * { width:100% !important; }
  body .hero__facts,
  body .landing-value { grid-template-columns:1fr !important; }
  body .section-heading,
  body .studio__heading,
  body .landing-section__heading,
  body .landing-proof__heading,
  body .landing-demo__heading,
  body .landing-uses__heading,
  body .landing-context__heading { grid-template-columns:1fr !important; align-items:start !important; gap:8px !important; margin-bottom:14px !important; }
  body .landing-proof__grid,
  body .landing-uses__grid,
  body .landing-context__grid,
  body .features__grid,
  body .principles__grid,
  body .landing-steps__grid,
  body .steps__grid,
  body .landing-demo__workspace,
  body .studio__workspace { grid-template-columns:1fr !important; gap:10px !important; }
  body .landing-proof__card,
  body .landing-uses__item,
  body .landing-context__item,
  body .feature-card,
  body .principle-card { padding:16px !important; }
  body .landing-proof__media { margin:14px -16px -16px !important; }
  body .closing,
  body .landing-closing { padding:18px !important; flex-direction:column !important; align-items:flex-start !important; }
  body .footer,
  body footer { padding:20px 18px !important; }
}

/* Cross-device composition pass: app viewport, laptop and wide desktop. */
body .landing-main > .landing-value {
  width: min(var(--nb-container), calc(100% - (var(--nb-gutter) * 2))) !important;
  max-width: var(--nb-container) !important;
  margin-inline: auto !important;
}

body .landing-proof__heading,
body .landing-demo__heading,
body .landing-uses__heading {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-areas: "label . note" "title title note" !important;
  column-gap: 12px !important;
}

body .landing-proof__heading > h2,
body .landing-demo__heading > h2,
body .landing-uses__heading > h2 {
  grid-area: title !important;
}

body .landing-proof__heading > p:last-child,
body .landing-demo__heading > p:last-child,
body .landing-uses__heading > p:last-child {
  grid-area: note !important;
  width: 100% !important;
  max-width: none !important;
  align-self: stretch !important;
  justify-self: stretch !important;
}

body .landing-main > section.landing-steps ol > li {
  grid-template-columns: 1fr !important;
}

body .landing-main > section.landing-steps ol > li::before {
  display: none !important;
  content: none !important;
}

body .landing-demo__workspace > article,
body .landing-demo[data-demo-shape] .landing-demo__workspace > article,
body .landing-demo[data-demo-type] .landing-demo__workspace > article {
  margin: 0 !important;
  transform: none !important;
  align-self: stretch !important;
}

body .landing-demo__media img {
  object-fit: contain !important;
  object-position: center !important;
}

body .business-card-result {
  grid-template-columns: 1fr !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 16px !important;
  padding: 28px !important;
}

body .business-card-result__identity strong {
  max-width: calc(100% - 12px) !important;
  font-size: clamp(34px, 3.2vw, 44px) !important;
}

body .business-card-result__contacts {
  width: 100% !important;
  padding: 14px 0 0 !important;
  border-top: 1px solid rgb(255 200 65 / 30%) !important;
  border-left: 0 !important;
}

body .business-card-result__contacts a {
  min-height: 24px !important;
  white-space: nowrap !important;
}

@media (min-width: 1024px) and (max-width: 1320px) {
  body #main-content > .hero {
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr) !important;
    grid-template-areas: "visual copy" "facts facts" !important;
    align-items: start !important;
  }

  body #main-content > .hero > .hero__visual {
    aspect-ratio: 3 / 2 !important;
    height: auto !important;
  }

  body #main-content > .hero > .hero__copy {
    height: 100% !important;
    align-content: center !important;
  }

  body #main-content > .hero > .hero__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    margin-top: 0 !important;
  }
}

@media (min-width: 1024px) and (max-width: 1119px) {
  body #main-content > .hero {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "visual" "facts" !important;
  }

  body .landing-main > .landing-hero {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "visual" !important;
  }

  body #main-content > .hero > .hero__copy,
  body .landing-main > .landing-hero > div:first-child {
    width: min(100%, 760px) !important;
    justify-self: center !important;
  }

  body #main-content > .hero > .hero__facts,
  body .landing-main > .landing-value {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* 2026-08-19: align section notes with the card grid and protect hero copy. */
body .landing-main > .landing-hero > div:first-child > h1 + .landing-hero__lead {
  margin-top: 18px !important;
}

@media (min-width: 1024px) {
  body .landing-main > section.landing-proof > .landing-proof__heading,
  body .landing-main > section.landing-demo > .landing-demo__heading,
  body .landing-main > section.landing-uses > .landing-uses__heading {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-areas: "label . note" "title title note" !important;
  }

  body .landing-main > section.landing-proof > .landing-proof__heading > p:last-child,
  body .landing-main > section.landing-demo > .landing-demo__heading > p:last-child,
  body .landing-main > section.landing-uses > .landing-uses__heading > p:last-child {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
    justify-self: stretch !important;
  }
}

@media (min-width: 1120px) and (max-width: 1440px) {
  body #main-content > .hero {
    grid-template-columns: minmax(0, 1.35fr) minmax(360px, .75fr) !important;
  }

  body #main-content > .hero > .hero__copy {
    padding: 30px !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 430px) {
  body .landing-main {
    margin-top: 4px !important;
  }
}

@media (max-width: 1023px) {
  body .landing-proof__heading,
  body .landing-demo__heading,
  body .landing-uses__heading {
    grid-template-columns: 1fr !important;
    grid-template-areas: "label" "title" "note" !important;
    row-gap: 14px !important;
  }

  body .landing-proof__heading > p:last-child,
  body .landing-demo__heading > p:last-child,
  body .landing-uses__heading > p:last-child {
    max-width: 42rem !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  body #main-content > .hero,
  body .landing-main > .landing-hero {
    grid-template-columns: 1fr 1fr !important;
    grid-template-areas: "copy copy" "visual visual" "facts facts" !important;
  }

  body #main-content > .hero > .hero__copy,
  body .landing-main > .landing-hero > div:first-child {
    max-width: 760px !important;
    justify-self: center !important;
  }

  body #main-content > .hero > .hero__facts,
  body .landing-main > .landing-value {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767px) {
  body .landing-main > .landing-value {
    grid-template-columns: 1fr !important;
  }

  body .business-card-result {
    min-height: 400px !important;
    padding: 24px !important;
  }

  body .business-card-result__identity strong {
    font-size: clamp(32px, 12vw, 42px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}

/* Final cascade guards: older release selectors are intentionally more specific. */
body .landing-main > section.landing-steps:not(.landing-hero):not(.landing-value):not(.closing) {
  background: var(--nb-yellow) !important;
  color: #17140d !important;
  border-color: rgba(255, 255, 255, .2) !important;
}

body .landing-main > section.landing-steps:not(.landing-hero):not(.landing-value):not(.closing) > .label {
  background: #17140d !important;
  color: var(--nb-yellow) !important;
  box-shadow: none !important;
}

body .landing-main > section.landing-steps:not(.landing-hero):not(.landing-value):not(.closing) h2,
body .landing-main > section.landing-steps:not(.landing-hero):not(.landing-value):not(.closing) li {
  color: #17140d !important;
}

body .landing-main > section.landing-uses:not(.landing-hero):not(.landing-value):not(.closing) h2 {
  color: var(--nb-text) !important;
}

@media (max-width: 767px) {
  body .landing-main .landing-demo__heading,
  body .landing-main .landing-uses__heading {
    grid-template-columns: 1fr !important;
    grid-template-areas: none !important;
  }

  body .landing-main .landing-demo__heading > *,
  body .landing-main .landing-uses__heading > * {
    grid-area: auto !important;
  }
}

body .landing-main > section.landing-uses:not(.landing-hero):not(.landing-value):not(.closing) .landing-uses__grid article h3 {
  color: var(--nb-text) !important;
}

body .landing-demo[data-demo-type="image"] .landing-demo__workspace > article,
body .landing-demo[data-demo-type="motion-frame"] .landing-demo__workspace > article {
  min-height: 0 !important;
  height: auto !important;
}

body .landing-demo[data-demo-shape="three-two"] .landing-demo__media img {
  height: auto !important;
  aspect-ratio: 3 / 2 !important;
}

body .landing-demo[data-demo-shape="four-three"] .landing-demo__media img {
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
}

body .landing-demo[data-demo-shape="portrait"] .landing-demo__media img {
  height: auto !important;
  aspect-ratio: 4 / 5 !important;
}

@media (min-width: 1024px) {
  body .features .feature-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-rows: auto !important;
  }

  body .features .feature-grid > .feature-card:nth-child(n) {
    grid-column: auto !important;
  }

  body .features .feature-grid > .feature-card:last-child {
    grid-column: 2 !important;
  }
}

@media (min-width: 768px) {
  body .landing-demo[data-demo-type="design-suite"] .landing-demo__workspace > .landing-demo__media:first-child,
  body .landing-demo[data-demo-type="design-suite"] .landing-demo__workspace > .landing-demo__prompt {
    height: 520px !important;
  }
}

/* Visual review pass: media-first composition and shared alignment across every route. */
body .logo {
  font-family: Inter, "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif !important;
  font-size: 16.5px !important;
  font-weight: 700 !important;
  letter-spacing: -.025em !important;
}

body #main-content > .hero {
  grid-template-columns: minmax(0, 7fr) minmax(300px, 3fr) !important;
  grid-template-areas:
    "visual copy"
    "facts copy" !important;
  grid-template-rows: auto auto !important;
  align-items: stretch !important;
}

body #main-content > .hero > .hero__facts {
  grid-area: facts !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body #main-content > .hero > .hero__facts li {
  justify-content: center !important;
  text-align: center !important;
}

body .features .section-heading--split,
body .landing-proof__heading {
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr) !important;
  grid-template-areas:
    "label note"
    "title note" !important;
  align-items: end !important;
  column-gap: clamp(28px, 5vw, 64px) !important;
}

body .features .section-heading--split > .label,
body .landing-proof__heading > .label { grid-area: label !important; }
body .features .section-heading--split > h2,
body .landing-proof__heading > h2 { grid-area: title !important; }
body .features .section-heading--split > p:last-child,
body .landing-proof__heading > p:last-child {
  grid-area: note !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
}

body .features .feature-grid {
  grid-auto-rows: minmax(330px, auto) !important;
  align-items: stretch !important;
}

body .features .feature-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

body .features .feature-card img,
body .features .feature-card--large img {
  width: 100% !important;
  height: auto !important;
  margin-top: auto !important;
  aspect-ratio: 3 / 2 !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 12px !important;
  background: #15140f !important;
}

body .studio__workspace {
  align-items: start !important;
}

body .studio__source,
body .studio__controls,
body .studio__result {
  align-self: start !important;
  height: auto !important;
}

body .studio__controls {
  display: grid !important;
  align-content: start !important;
  gap: 16px !important;
}

body .studio__source img,
body .studio__result img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: #efe8dc !important;
}

body .landing-main > .landing-hero {
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, .9fr) !important;
  grid-template-areas: "visual copy" !important;
  gap: clamp(20px, 3vw, 34px) !important;
  align-items: stretch !important;
}

body .landing-main > .landing-hero > div:first-child {
  grid-area: copy !important;
}

body .landing-main > .landing-hero > .landing-hero__visual {
  grid-area: visual !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 3 / 2 !important;
  justify-self: stretch !important;
}

body .landing-main > .landing-hero > .landing-hero__visual img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  aspect-ratio: 3 / 2 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: var(--nb-panel) !important;
}

body .landing-main > .landing-value {
  width: min(760px, calc(100% - (var(--nb-gutter) * 2))) !important;
  max-width: 760px !important;
  margin-right: auto !important;
  margin-left: max(var(--nb-gutter), calc((100% - var(--nb-container)) / 2)) !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body .landing-main > section.landing-steps ol {
  counter-reset: nb-step !important;
}

body .landing-main > section.landing-steps ol > li {
  counter-increment: nb-step !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  align-items: center !important;
}

body .landing-main > section.landing-steps ol > li::before {
  width: 30px !important;
  height: 30px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: #17140d !important;
  color: var(--nb-yellow) !important;
  content: counter(nb-step, decimal-leading-zero) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

body .landing-demo__workspace,
body .landing-demo[data-demo-shape] .landing-demo__workspace,
body .landing-demo[data-demo-type] .landing-demo__workspace {
  align-items: stretch !important;
}

body .landing-demo__workspace > article {
  align-self: stretch !important;
  grid-template-rows: 48px minmax(0, 1fr) !important;
}

body .landing-demo__workspace > .landing-demo__prompt {
  display: grid !important;
  grid-template-rows: 48px minmax(0, 1fr) !important;
  gap: 0 !important;
}

body .landing-demo__workspace > .landing-demo__prompt p {
  display: flex !important;
  align-items: flex-start !important;
}

body .landing-demo__media img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: #15140f !important;
}

body .landing-main > section.landing-uses:not(.landing-hero):not(.landing-value):not(.closing) .landing-uses__grid article {
  border: 1px solid var(--nb-line) !important;
  background: var(--nb-panel-2) !important;
  color: var(--nb-text) !important;
}

body .landing-main > section.landing-uses:not(.landing-hero):not(.landing-value):not(.closing) .landing-uses__grid article p {
  color: var(--nb-muted) !important;
}

body .landing-faq > .label {
  margin-bottom: 18px !important;
}

body .landing-demo[data-demo-type="design-suite"] .landing-demo__workspace {
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr) !important;
}

body .landing-demo[data-demo-type="design-suite"] .landing-demo__media--result {
  grid-column: 1 / -1 !important;
  min-height: 0 !important;
}

body .landing-demo[data-demo-type="design-suite"] .design-suite {
  width: 100% !important;
  height: auto !important;
  padding: 14px !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: 380px !important;
  gap: 12px !important;
}

body .landing-demo[data-demo-type="design-suite"] .design-suite > div {
  min-width: 0 !important;
  min-height: 0 !important;
  grid-column: auto !important;
  grid-row: auto !important;
  border: 1px solid var(--nb-line) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}

body .landing-demo[data-demo-type="design-suite"] .design-suite__card {
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  background: #f4eddf !important;
  color: #17150f !important;
}

body .landing-demo[data-demo-type="design-suite"] .design-suite__card > img {
  width: 100% !important;
  height: 280px !important;
  min-height: 0 !important;
  flex: 1 1 auto !important;
  object-fit: contain !important;
  background: #15140f !important;
}

body .landing-demo[data-demo-type="design-suite"] .design-suite__card > div {
  position: relative !important;
  z-index: 1 !important;
  flex: 0 0 auto !important;
  padding: 14px 16px !important;
  background: #f4eddf !important;
}

body .landing-demo[data-demo-type="design-suite"] .design-suite__card strong {
  color: #17150f !important;
}

body .landing-demo[data-demo-type="design-suite"] .design-suite__card b {
  color: #6d6252 !important;
}

@media (max-width: 1023px) {
  body #main-content > .hero {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "visual" "facts" !important;
  }

  body .landing-main > .landing-hero {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "visual" !important;
  }

  body .landing-main > .landing-value {
    width: min(calc(100% - (var(--nb-gutter) * 2)), var(--nb-container)) !important;
    max-width: var(--nb-container) !important;
    margin-inline: auto !important;
  }
}

@media (max-width: 767px) {
  body .landing-demo[data-demo-type="design-suite"] .design-suite__card > img {
    height: 250px !important;
  }

  body #main-content > .hero > .hero__facts,
  body .landing-main > .landing-value {
    grid-template-columns: 1fr !important;
  }

  body .features .section-heading--split,
  body .landing-proof__heading {
    grid-template-columns: 1fr !important;
    grid-template-areas: "label" "title" "note" !important;
  }

  body .landing-demo[data-demo-type="design-suite"] .landing-demo__workspace,
  body .landing-demo[data-demo-type="design-suite"] .design-suite {
    grid-template-columns: 1fr !important;
  }

  body .landing-demo[data-demo-type="design-suite"] .design-suite {
    grid-template-rows: repeat(3, minmax(300px, auto)) !important;
  }
}

/* Final responsive authority. Keep this block last. */
body .landing-main > .landing-value {
  width: min(var(--nb-container), calc(100% - (var(--nb-gutter) * 2))) !important;
  max-width: var(--nb-container) !important;
  margin-inline: auto !important;
}

body .landing-proof__heading,
body .landing-demo__heading,
body .landing-uses__heading {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-areas: "label . note" "title title note" !important;
  column-gap: 12px !important;
}

body .landing-proof__heading > h2,
body .landing-demo__heading > h2,
body .landing-uses__heading > h2 { grid-area: title !important; }

body .landing-proof__heading > p:last-child,
body .landing-demo__heading > p:last-child,
body .landing-uses__heading > p:last-child {
  grid-area: note !important;
  width: 100% !important;
  max-width: none !important;
  align-self: stretch !important;
  justify-self: stretch !important;
}

body .landing-main > section.landing-steps ol > li {
  grid-template-columns: 1fr !important;
  counter-increment: none !important;
}

body .landing-main > section.landing-steps ol > li::before {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  content: none !important;
}

body .landing-demo__workspace > article,
body .landing-demo[data-demo-shape] .landing-demo__workspace > article,
body .landing-demo[data-demo-type] .landing-demo__workspace > article {
  margin: 0 !important;
  transform: none !important;
  align-self: stretch !important;
}

@media (min-width: 1024px) and (max-width: 1320px) {
  body #main-content > .hero {
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr) !important;
    grid-template-areas: "visual copy" "facts facts" !important;
    align-items: start !important;
  }

  body #main-content > .hero > .hero__visual {
    aspect-ratio: 3 / 2 !important;
    height: auto !important;
  }

  body #main-content > .hero > .hero__copy {
    height: 100% !important;
    align-content: center !important;
  }

  body #main-content > .hero > .hero__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    margin-top: 0 !important;
  }
}

@media (max-width: 1023px) {
  body .landing-proof__heading,
  body .landing-demo__heading,
  body .landing-uses__heading {
    grid-template-columns: 1fr !important;
    grid-template-areas: "label" "title" "note" !important;
    row-gap: 14px !important;
  }

  body .landing-proof__heading > p:last-child,
  body .landing-demo__heading > p:last-child,
  body .landing-uses__heading > p:last-child { max-width: 42rem !important; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  body #main-content > .hero,
  body .landing-main > .landing-hero {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "visual" "facts" !important;
  }

  body #main-content > .hero > .hero__copy,
  body .landing-main > .landing-hero > div:first-child {
    max-width: 760px !important;
    justify-self: center !important;
  }

  body #main-content > .hero > .hero__facts,
  body .landing-main > .landing-value {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767px) {
  body .landing-main > .landing-value { grid-template-columns: 1fr !important; }
}

@media (min-width: 1024px) {
  body .landing-main > section.landing-proof > .landing-proof__heading,
  body .landing-main > section.landing-demo > .landing-demo__heading,
  body .landing-main > section.landing-uses > .landing-uses__heading {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-areas: "label . note" "title title note" !important;
    grid-auto-flow: row !important;
    gap: 12px !important;
  }
}

@media (max-width: 1023px) {
  body .landing-main > section.landing-proof > .landing-proof__heading,
  body .landing-main > section.landing-demo > .landing-demo__heading,
  body .landing-main > section.landing-uses > .landing-uses__heading {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 14px !important;
  }

  body .landing-main > section.landing-proof > .landing-proof__heading > *,
  body .landing-main > section.landing-demo > .landing-demo__heading > *,
  body .landing-main > section.landing-uses > .landing-uses__heading > * {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  body .landing-main > section.landing-proof > .landing-proof__heading > .label,
  body .landing-main > section.landing-demo > .landing-demo__heading > .label,
  body .landing-main > section.landing-uses > .landing-uses__heading > .label {
    width: fit-content !important;
  }
}

@media (min-width: 1024px) and (max-width: 1119px) {
  body #main-content > .hero {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "visual" "facts" !important;
  }

  body .landing-main > .landing-hero {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "visual" !important;
  }

  body #main-content > .hero > .hero__copy,
  body .landing-main > .landing-hero > div:first-child {
    width: min(100%, 760px) !important;
    justify-self: center !important;
  }

  body #main-content > .hero > .hero__facts,
  body .landing-main > .landing-value {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* Final alignment authority for the reviewed desktop and laptop layouts. */
body .landing-main > .landing-hero > div:first-child > h1 + .landing-hero__lead {
  margin-top: 18px !important;
}

@media (min-width: 1024px) {
  body .landing-main > section.landing-proof > .landing-proof__heading,
  body .landing-main > section.landing-demo > .landing-demo__heading,
  body .landing-main > section.landing-uses > .landing-uses__heading {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-areas: "label . note" "title title note" !important;
  }

  body .landing-main > section.landing-proof > .landing-proof__heading > p:last-child,
  body .landing-main > section.landing-demo > .landing-demo__heading > p:last-child,
  body .landing-main > section.landing-uses > .landing-uses__heading > p:last-child {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
    justify-self: stretch !important;
  }
}

@media (min-width: 1120px) and (max-width: 1440px) {
  body #main-content > .hero {
    grid-template-columns: minmax(0, 1.35fr) minmax(360px, .75fr) !important;
  }

  body #main-content > .hero > .hero__copy {
    padding: 30px !important;
    box-sizing: border-box !important;
  }

  body #main-content > .hero > .hero__copy > h1,
  body #main-content > .hero > .hero__copy > p {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Final review: compact footer, unmistakable banana mark and media-safe cards. */
body .logo__mark,
body .logo--footer .logo__mark {
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: url("assets/brand-banana.svg?v=20260819-2") center / contain no-repeat !important;
  box-shadow: 0 5px 14px rgba(255, 190, 36, .12) !important;
}

body .logo__mark::before,
body .logo__mark::after,
body .logo--footer .logo__mark::before,
body .logo--footer .logo__mark::after {
  display: none !important;
  content: none !important;
}

body > .footer,
body > footer {
  height: auto !important;
  min-height: 0 !important;
  padding: 24px 24px 18px !important;
  grid-auto-rows: max-content !important;
  align-content: start !important;
  column-gap: 28px !important;
  row-gap: 14px !important;
}

body .footer__column {
  gap: 7px !important;
}

body .footer__column h3 {
  margin-bottom: 6px !important;
}

body .footer__bottom {
  margin-top: 8px !important;
  padding-top: 14px !important;
}

body.landing-page--ozhivlenie-foto .motion-demo-card {
  display: flex !important;
  flex-direction: column !important;
}

body.landing-page--ozhivlenie-foto .motion-demo-card__visual {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  margin: 18px 0 0 !important;
  overflow: hidden !important;
  border-radius: 14px !important;
}

body.landing-page--ozhivlenie-foto .motion-demo-card__button {
  position: static !important;
  inset: auto !important;
  width: fit-content !important;
  max-width: 100% !important;
  min-height: 44px !important;
  margin: 16px auto 2px !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: 0 8px 20px rgba(255, 174, 52, .18) !important;
}

body.landing-page--ozhivlenie-foto .motion-demo-card__button .motion-demo-card__label {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
}

body.landing-page--sozdat-dizayn .landing-proof__card > p {
  margin-bottom: 0 !important;
}

body.landing-page--sozdat-dizayn .landing-proof__media {
  margin-top: 24px !important;
}

body.landing-page--sozdat-dizayn .landing-demo[data-demo-type="design-suite"] .landing-demo__workspace > .landing-demo__media:first-child img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: #15140f !important;
}

body.landing-page--sozdat-dizayn .design-suite__banner img {
  object-fit: cover !important;
  object-position: center right !important;
}

@media (max-width: 767px) {
  body > .footer,
  body > footer {
    padding: 20px 18px 16px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 18px !important;
    row-gap: 18px !important;
  }

  body .footer__brand,
  body .footer__bottom {
    grid-column: 1 / -1 !important;
  }

  body.landing-page--sozdat-dizayn .landing-proof__media {
    margin-top: 18px !important;
  }

  body.landing-page--ozhivlenie-foto .motion-demo-card__visual {
    aspect-ratio: 16 / 10 !important;
  }
}

/* Use the supplied banana artwork unchanged; styling belongs to its frame. */
body .logo__mark,
body .logo--footer .logo__mark {
  border: 1px solid rgba(83, 57, 10, .78) !important;
  background: #ffd126 url("assets/brand-banana-original-v4.png") center / contain no-repeat !important;
  box-shadow:
    0 0 0 2px rgba(255, 227, 108, .12),
    0 6px 16px rgba(102, 71, 11, .16) !important;
}

body .footer__brand .logo--footer {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #17140d !important;
  font-family: Inter, "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 750 !important;
  letter-spacing: -.02em !important;
  text-decoration: none !important;
}

body .footer__brand .logo--footer > span:last-child {
  display: inline !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  color: #17140d !important;
}

body .footer__brand > p {
  color: #6b655b !important;
  font-family: Inter, "Segoe UI Variable Text", "Segoe UI", system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
}

@media (max-width: 520px) {
  body > .footer,
  body > footer {
    grid-template-columns: 1fr !important;
  }

  body .footer__brand,
  body .footer__column,
  body .footer__bottom {
    grid-column: 1 !important;
  }
}

/* Final polish: legible hero tools and balanced business-card composition. */
body #main-content > .hero > .hero__facts li {
  min-height: 56px !important;
  padding: 10px 14px !important;
  gap: 12px !important;
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  justify-content: stretch !important;
  text-align: left !important;
}

body #main-content > .hero > .hero__facts svg {
  box-sizing: border-box !important;
  width: 36px !important;
  height: 36px !important;
  flex: 0 0 36px !important;
  padding: 7px !important;
  color: #21190b !important;
  stroke: currentColor !important;
  stroke-width: 2.25 !important;
  border: 1px solid rgba(255, 233, 148, .92) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #ffe782, #f5b725) !important;
  box-shadow: 0 7px 18px rgba(255, 186, 36, .22) !important;
}

body #main-content > .hero > .hero__facts strong {
  font-size: 14.5px !important;
  width: 100% !important;
  text-align: left !important;
}

body.landing-page--sozdat-vizitku .business-card-result__product {
  top: 28px !important;
  right: auto !important;
  left: 28px !important;
  width: 112px !important;
  height: 152px !important;
}

body.landing-page--sozdat-vizitku .business-card-result__mark {
  right: 28px !important;
  left: auto !important;
}

@media (max-width: 767px) {
  body #main-content > .hero > .hero__facts li {
    justify-content: flex-start !important;
    text-align: left !important;
  }

  body.landing-page--sozdat-vizitku .business-card-result__product {
    top: 22px !important;
    left: 24px !important;
    width: 92px !important;
    height: 124px !important;
  }

  body.landing-page--sozdat-vizitku .business-card-result__mark {
    right: 24px !important;
  }
}

@media (max-width: 420px) {
  body.landing-page--sozdat-vizitku .business-card-result__product {
    left: 20px !important;
    width: 84px !important;
    height: 114px !important;
  }
}

/* Brand sign and footer statement — final identity pass. */
body .logo__mark,
body .logo--footer .logo__mark {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  border: 1px solid rgba(80, 51, 5, .72) !important;
  border-radius: 11px !important;
  background: #ffd126 url("assets/brand-banana-original-v4.png") center / contain no-repeat !important;
  box-shadow:
    0 0 0 1px rgba(255, 236, 153, .22),
    0 7px 18px rgba(255, 183, 25, .18) !important;
}

body .footer__brand > p {
  display: block !important;
  max-width: 300px !important;
  margin: 14px 0 0 !important;
  color: #5c5549 !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
}

@media (max-width: 767px) {
  body .logo__mark,
  body .logo--footer .logo__mark {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
    border-radius: 10px !important;
  }

  body .footer__brand > p {
    max-width: 32rem !important;
    font-size: 14px !important;
  }
}

/* One brand mark everywhere: header, inner pages and footer. */
body .logo__mark,
body .header .logo__mark,
body .header--internal .logo__mark,
body .footer__brand .logo--footer .logo__mark {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  overflow: hidden !important;
  border: 2px solid #e9a900 !important;
  border-radius: 12px !important;
  background: #ffcb19 url("assets/brand-banana-original-v4.png?v=20260819-13") center / cover no-repeat !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 249, 212, .72),
    0 0 0 2px rgba(255, 204, 35, .12),
    0 7px 18px rgba(139, 91, 0, .2) !important;
  filter: saturate(1.08) contrast(1.04) !important;
}

body .logo__mark::before,
body .logo__mark::after,
body .header .logo__mark::before,
body .header .logo__mark::after,
body .header--internal .logo__mark::before,
body .header--internal .logo__mark::after,
body .footer__brand .logo--footer .logo__mark::before,
body .footer__brand .logo--footer .logo__mark::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 767px) {
  body .logo__mark,
  body .header .logo__mark,
  body .header--internal .logo__mark,
  body .footer__brand .logo--footer .logo__mark {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
    border-radius: 11px !important;
  }
}