:root { color-scheme: light; }
html, body, #main, [data-framer-root], main { background: #fff !important; color: #171717; }
main > section { background-color: #fff !important; }
main .framer-text, header .framer-text { --framer-text-color: #171717 !important; color: #171717 !important; }
h1.framer-text, h2.framer-text, h3.framer-text {
  font-family: 'Roboto Condensed', Arial, sans-serif !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: -.025em !important;
}
h1.framer-text em, h2.framer-text em, h3.framer-text em { font: inherit; font-style: italic; }
header, header nav, header [data-framer-name="Menu"] { background: rgba(255,255,255,.97) !important; }
header { border-bottom: 1px solid #e9e9e9; }
header [data-framer-name="Logo and Name"] { filter: invert(1); }
header [data-framer-name="Links"] { gap: 4px !important; }
header [role="button"]:hover { background: #f1f1f1 !important; }
header [data-framer-name="Links"] svg { filter: invert(1); }
header [data-framer-name="Links"] .framer-text { font-size: 14px !important; }
#announcement-banner { background: #f0ebff !important; }
#announcement-banner [data-framer-name] { background-color: #f0ebff !important; }
#announcement-banner .framer-text { color: #4d28c8 !important; --framer-text-color: #4d28c8 !important; }
#announcement-banner a { color: #4d28c8 !important; }
#hero-screen h1 { font-size: clamp(44px, 4vw, 70px) !important; }
#hero-screen .framer-text { color: #fff !important; --framer-text-color: #fff !important; }
#hero-screen a .framer-text { color: #111 !important; --framer-text-color: #111 !important; }
#hero-screen p { line-height: 1.4 !important; }
#clients-logos ul { filter: invert(1); }
#clients-logos p { color: #727272 !important; }
#articles-about-recraft a { filter: brightness(0); }
#prompt-understanding h2, #prompt-understanding h3 { color: #171717 !important; --framer-text-color: #171717 !important; }
#prompt-understanding .framer-QRqey h2 { color: #fff !important; --framer-text-color: #fff !important; }
.prompt-fragment { display: flex; align-items: center; box-sizing: border-box; height: 100%; padding: 12px 14px; background: #fff; border-radius: 10px; color: #636363; font: 16px/1.35 Geist, Arial, sans-serif; box-shadow: 0 4px 24px #0000000d; }
.prompt-fragment strong { color: #171717; font-weight: 600; }
.framer--slideshow-controls > div:first-child button { background: #ececec !important; }
.framer--slideshow-controls > div:first-child button:hover { background: #dfdfdf !important; }
.framer--slideshow-controls > div:first-child img { filter: invert(1); }
main > section:not(#hero-screen) button[data-slide] > div { background-color: #252525 !important; }
[data-carousel-track] [data-framer-component-type="RichTextContainer"] { max-width: 100% !important; width: 100% !important; white-space: normal !important; }
[data-carousel-track] p { white-space: normal !important; overflow-wrap: break-word; padding-inline: 8px; }
#about-recraft-studio a { background: #d2fc31 !important; }
#about-recraft-studio a .framer-text { color: #171717 !important; }
.navigation-dropdown { color: #171717; border-color: #e5e5e5; background: #fff; box-shadow: 0 14px 50px #00000014; }
.navigation-dropdown a { color: #171717; }
.navigation-dropdown a:hover, .navigation-dropdown a:focus-visible { background: #f3f1f9; }
.mobile-navigation { background: #fff; color: #171717; }
.mobile-navigation > a, .mobile-navigation summary { color: #171717; border-color: #e8e8e8; }
.mobile-navigation details a { color: #555; }
.mobile-close { background: #efefef; }
#custom-styles [aria-pressed="true"] { box-shadow: 0 0 0 3px #6841fb; }
#custom-styles .framer-6tf6l2 { background: #fff !important; }
[data-carousel]:focus-visible, a:focus-visible, button:focus-visible, [role="button"]:focus-visible, summary:focus-visible { outline-color: #6841fb; }
@media (min-width: 760px) {
  #hero-screen .framer-c1u9bt { max-width: 880px; }
}
@media (max-width: 759.98px) {
  #hero-screen h1 { font-size: clamp(32px, 8.5vw, 48px) !important; }
  main h2.framer-text, main h3.framer-text { font-size: clamp(30px, 8vw, 38px) !important; }
  #hero-screen p { font-size: 16px !important; }
  #hero-screen .framer-text { color: #fff !important; --framer-text-color: #fff !important; }
  #hero-screen a .framer-text { color: #171717 !important; --framer-text-color: #171717 !important; }
  #announcement-banner .framer-text { font-size: 13px !important; line-height: 1.35 !important; }
}
.store-label { color: #fff; font: 500 16px/1.3 Geist, Arial, sans-serif; text-align: center; }
/* The duplicated responsive visual headings share one semantic H1. */
#hero-screen .hero-heading{font-family:'Roboto Condensed',Arial,sans-serif!important;font-weight:900!important;line-height:1.02!important;letter-spacing:-.025em!important;font-size:clamp(44px,4vw,70px)!important;text-transform:uppercase}
#hero-screen .hero-heading em{font:inherit;font-style:italic}
@media(max-width:759.98px){#hero-screen .hero-heading{font-size:clamp(32px,8.5vw,48px)!important}}
#hero-screen .accessible-headline{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
