/* The 411 — site-wide 2026 visual system */
:root{
  --411-black:#070809;--411-black-2:#101213;--411-cream:#fff7e8;--411-cream-2:#f6ecd9;
  --411-green:#c8ff28;--411-green-soft:#e7ff9a;--411-pink:#ff2f92;--411-pink-soft:#ffd0e6;
  --411-ink:#111315;--411-muted:#6e7072;--411-line-dark:#292c2e;--411-line-light:rgba(17,19,21,.18);
}
html{scroll-behavior:smooth}body{overflow-x:hidden}
::selection{background:var(--411-green);color:var(--411-black)}
a,button,input,textarea,select{transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease}
button:active,a[class*="btn"]:active,.pill:active{transform:translateY(1px) scale(.985)!important}
:focus-visible{outline:3px solid var(--411-pink)!important;outline-offset:3px!important}

/* Public pages: alternating editorial surfaces rather than one endless black canvas. */
.site-public .surface-cream{background:var(--411-cream)!important;color:var(--411-ink)!important;border-color:var(--411-line-light)!important}
.site-public .surface-green{background:var(--411-green)!important;color:var(--411-ink)!important;border-color:var(--411-line-light)!important}
.site-public .surface-pink{background:var(--411-pink)!important;color:#fff!important;border-color:rgba(255,255,255,.25)!important}
.site-public .surface-dark{background:var(--411-black)!important;color:#f8f8f3!important}
.site-public .surface-cream h1,.site-public .surface-cream h2,.site-public .surface-cream h3,.site-public .surface-cream h4,
.site-public .surface-green h1,.site-public .surface-green h2,.site-public .surface-green h3,.site-public .surface-green h4{color:var(--411-ink)!important}
.site-public .surface-cream p,.site-public .surface-cream small,.site-public .surface-cream .section-top p,.site-public .surface-cream .case-hint{color:#54575a!important}
.site-public .surface-green p,.site-public .surface-green small,.site-public .surface-green .section-top p,.site-public .surface-green .case-hint{color:#252729!important}
.site-public .surface-pink p,.site-public .surface-pink small,.site-public .surface-pink .section-top p{color:rgba(255,255,255,.88)!important}
.site-public .surface-cream .section-no,.site-public .surface-green .section-no{color:#111315!important}
.site-public .surface-pink .section-no{color:#fff!important}
.site-public .surface-cream .feature-card,.site-public .surface-cream .service,.site-public .surface-cream .quote,
.site-public .surface-green .feature-card,.site-public .surface-green .service,.site-public .surface-green .quote{background:#fff!important;border-color:var(--411-line-light)!important;color:var(--411-ink)!important}
.site-public .surface-cream .step,.site-public .surface-green .step,.site-public .surface-cream .impact-grid,.site-public .surface-green .impact-grid,
.site-public .surface-cream .services,.site-public .surface-green .services,.site-public .surface-cream .quote-grid,.site-public .surface-green .quote-grid{border-color:var(--411-line-light)!important}
.site-public .surface-cream .step,.site-public .surface-green .step,.site-public .surface-cream .stat,.site-public .surface-green .stat{border-color:var(--411-line-light)!important}
.site-public .surface-green .pill.green{background:var(--411-black)!important;color:#fff!important}
.site-public .surface-pink .pill.green{background:#fff!important;color:var(--411-black)!important}
.site-public .surface-cream .pill.ghost,.site-public .surface-green .pill.ghost{background:transparent!important;color:var(--411-black)!important;border-color:rgba(17,19,21,.28)!important}
.site-public .surface-cream .creator-photo span,.site-public .surface-green .creator-photo span{background:var(--411-black)!important;color:#fff!important}
.site-public .surface-cream .slack-shot,.site-public .surface-green .slack-shot{border-color:rgba(17,19,21,.2)!important}
.site-public .surface-cream .video-card,.site-public .surface-green .video-card{box-shadow:0 12px 32px rgba(17,19,21,.12)}
.site-public .surface-pink .feature-card{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.3)!important}
.site-public .surface-pink .feature-card p{color:rgba(255,255,255,.82)!important}
.site-public .site-nav{box-shadow:0 1px 0 rgba(255,255,255,.03)}
.site-public .pill,.site-public .nav-cta,.site-public .creator-cta a{box-shadow:0 0 0 rgba(0,0,0,0)}
.site-public .pill:hover,.site-public .nav-cta:hover,.site-public .creator-cta a:hover{box-shadow:0 10px 28px rgba(0,0,0,.18);transform:translateY(-2px)}

/* Forms, application flows, internal tools and portals share the same brand now. */
.site-form,.site-admin,.site-portal{background:var(--411-cream)!important;color:var(--411-ink)!important;min-height:100vh}
.site-form .topbar,.site-admin .top,.site-portal .top,.site-portal .nav,.site-portal .mobileTop{background:var(--411-black)!important;color:#fff!important;border-color:var(--411-line-dark)!important}
.site-form .brand,.site-admin .brand,.site-portal .brand,.site-portal .logo{color:#fff!important}
.site-form .eyebrow,.site-admin .eyebrow,.site-portal .eyebrow{color:#791047!important}
.site-form .panel,.site-form .side,.site-form .successCard,.site-form .file,.site-form .choice,.site-form .radioCard,.site-form .campaignTerms,
.site-admin .panel,.site-admin .loginCard,.site-admin .card,.site-admin .row,.site-admin .contractStageBox,.site-admin .noteBox,.site-admin .replyComposer,
.site-portal .card,.site-portal .loginCard,.site-portal .panel,.site-portal .field,.site-portal .authGateCard,.site-portal .examplePanel{background:#fff!important;color:var(--411-ink)!important;border-color:#dfd2c1!important;box-shadow:0 14px 34px rgba(17,19,21,.06)}
.site-form .side{background:var(--411-black)!important;color:#fff!important;border-color:var(--411-black)!important}
.site-form .side p,.site-form .side .tiny,.site-form .side .hint{color:#c2c4c3!important}
.site-form .step.active,.site-form .choice.selected,.site-form .radioCard.selected{border-color:var(--411-pink)!important;box-shadow:0 0 0 2px rgba(255,47,146,.12)!important}
.site-form .step.active .num,.site-form .step.done .num{background:var(--411-pink)!important;color:#fff!important;border-color:var(--411-pink)!important}
.site-form input,.site-form textarea,.site-form select,.site-admin input,.site-admin textarea,.site-admin select,.site-portal input,.site-portal textarea,.site-portal select{background:#fff!important;color:var(--411-ink)!important;border:1px solid #cfc2b1!important;border-radius:10px!important}
.site-form input:focus,.site-form textarea:focus,.site-form select:focus,.site-admin input:focus,.site-admin textarea:focus,.site-admin select:focus,.site-portal input:focus,.site-portal textarea:focus,.site-portal select:focus{border-color:var(--411-pink)!important;box-shadow:0 0 0 4px rgba(255,47,146,.12)!important;outline:none!important}
.site-form .btn.primary,.site-form button.primary,.site-admin .action.green,.site-admin button:not(.plain):not(.filter):not(.tab):not(.switch),.site-portal .btn:not(.light):not(.secondary):not(.alt){background:var(--411-green)!important;color:var(--411-black)!important;border-color:var(--411-green)!important;font-weight:800!important}
.site-form .btn.primary:hover,.site-admin .action.green:hover,.site-portal .btn:not(.light):not(.secondary):not(.alt):hover{background:var(--411-pink)!important;color:#fff!important;border-color:var(--411-pink)!important;transform:translateY(-1px)}
.site-form .btn.secondary,.site-portal .btn.secondary,.site-portal .btn.alt,.site-portal .btn.light{background:#fff!important;color:var(--411-ink)!important;border-color:#cfc2b1!important}
.site-admin .login,.site-portal .login,.site-portal .authGate{background:linear-gradient(135deg,var(--411-black) 0 58%,#172000 58% 100%)!important}
.site-admin .loginCard,.site-portal .loginCard,.site-portal .authGateCard{border-top:6px solid var(--411-green)!important}
.site-admin .switcher,.site-admin .tabs,.site-admin .toolbar{border-color:#dfd2c1!important}
.site-admin .switch.active,.site-admin .tab.active,.site-admin .filter.active{background:var(--411-black)!important;color:#fff!important;border-color:var(--411-black)!important}
.site-admin .typeFlag.creator,.site-admin .badge.Accepted,.site-admin .badge.accepted{background:var(--411-pink-soft)!important;color:#76123f!important}
.site-admin .typeFlag.client{background:var(--411-green-soft)!important;color:#344000!important}
.site-admin .metric:nth-child(odd){border-top:4px solid var(--411-green)!important}.site-admin .metric:nth-child(even){border-top:4px solid var(--411-pink)!important}
.site-portal .sidebar{background:var(--411-black)!important;color:#fff!important}.site-portal .sidebar a,.site-portal .sidebar p,.site-portal .sidebar span{color:inherit}
.site-portal .progressBox,.site-portal .tipStrip,.site-portal .notice,.site-portal .takeaway{background:var(--411-green-soft)!important;color:var(--411-ink)!important;border-color:#badb51!important}
.site-portal .founder:nth-child(even),.site-portal .channel:nth-child(even){background:var(--411-pink-soft)!important}

/* Legal pages belong to the same site too. */
.site-legal{background:var(--411-cream)!important;color:var(--411-ink)!important}
.site-legal .policy-nav{background:var(--411-black)!important;border-bottom:1px solid var(--411-line-dark)!important}
.site-legal .policy-wrap{max-width:920px!important}
.site-legal .policy-kicker{color:#791047!important}
.site-legal .policy-section{background:#fff!important;border:1px solid #e2d7c8!important;border-radius:14px!important;padding:28px!important;margin:14px 0!important}
.site-legal .policy-footer{border-top:1px solid #d8cbbb!important;color:#64676a!important}

/* Small screens: no horizontal leaks, larger touch targets, cleaner stacks. */
@media(max-width:800px){
  .site-public main>section{overflow:hidden}
  .site-form .shell,.site-form .layout,.site-admin .wrap,.site-admin .grid,.site-portal .shell,.site-portal .main{max-width:100%!important;width:100%!important}
  .site-form .layout,.site-admin .grid{grid-template-columns:1fr!important}
  .site-form .side{position:relative!important;top:auto!important}
  .site-form .grid2{grid-template-columns:1fr!important}
  .site-admin .topin,.site-portal .topin{padding-left:16px!important;padding-right:16px!important}
  .site-admin .topActions{gap:6px!important;flex-wrap:wrap!important}
  .site-admin .panel,.site-portal .card{border-radius:12px!important}
  .site-form button,.site-form .btn,.site-admin button,.site-admin .action,.site-portal button,.site-portal .btn{min-height:44px}
  .site-legal .policy-wrap{padding-left:18px!important;padding-right:18px!important}
  .site-legal .policy-section{padding:20px!important}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* FINAL BRAND CORRECTION — new identity everywhere */
:root{--411-black:#050607;--411-black-2:#0c0e0f;--411-cream:#f6f0e5;--411-green:#c8ff28;--411-pink:#ff2f92;--411-white:#fff;}
.site-public{background:var(--411-black)!important;color:#fff!important}
.site-public .site-nav{background:rgba(5,6,7,.94)!important;border-color:#242729!important;color:#fff!important}
.site-public .brand img{width:34px!important;height:34px!important;object-fit:contain!important}
.site-public .brand span{font-weight:900!important;letter-spacing:-.03em!important}
.site-public .hero,.site-public .trusted{background:var(--411-black)!important;color:#fff!important;border-color:#242729!important}
.site-public .hero h1,.site-public .hero h2,.site-public .hero h3{color:#fff!important}
.site-public .hero-copy,.site-public .hero p{color:#a9adaf!important}
.site-public .surface-dark{background:var(--411-black)!important;color:#fff!important}
.site-public .surface-cream{background:var(--411-cream)!important;color:#111!important}
.site-public .surface-green{background:var(--411-green)!important;color:#080909!important}
.site-public .surface-pink{background:var(--411-pink)!important;color:#fff!important}
.site-public .surface-dark .section-top p,.site-public .surface-dark p{color:#a9adaf!important}
.site-public .surface-dark .feature-card,.site-public .surface-dark .service{background:#0b0d0e!important;border-color:#25282a!important}
.site-public .surface-dark .feature-card p,.site-public .surface-dark .service p{color:#929698!important}
.site-public .surface-dark .section-no{color:var(--411-green)!important}
.site-public .surface-dark .section-no.pink{color:var(--411-pink)!important}
.site-public .site-footer{background:#050607!important;color:#fff!important}
.site-public .foot-brand:before{content:"";display:inline-block;width:32px;height:32px;background:url('the411-brand-mark.svg') center/contain no-repeat;vertical-align:middle;margin-right:10px}

/* Internal/app surfaces are dark too; cream is used only for cards and readable form fields. */
.site-form,.site-admin,.site-portal,.site-legal{background:var(--411-black)!important;color:#fff!important}
.site-form .topbar,.site-admin .top,.site-portal .top,.site-portal .nav,.site-portal .mobileTop,.site-legal .policy-nav{background:#050607!important;border-color:#242729!important;color:#fff!important}
.site-form .topbar .brand:before,.site-form .brand:before{content:"";display:inline-block;width:30px;height:30px;background:url('the411-brand-mark.svg') center/contain no-repeat;vertical-align:middle;margin-right:9px}
.site-form .topbar .brand img,.site-form .brand img{display:none!important}
.site-admin .loginCard:before,.site-portal .loginCard:before,.site-portal .authGateCard:before{content:"";display:block;width:46px;height:46px;background:url('the411-brand-mark.svg') center/contain no-repeat;margin:0 0 16px}
.site-form .panel,.site-form .successCard,.site-form .file,.site-form .choice,.site-form .radioCard,.site-form .campaignTerms,
.site-admin .panel,.site-admin .loginCard,.site-admin .card,.site-admin .row,.site-admin .contractStageBox,.site-admin .noteBox,.site-admin .replyComposer,
.site-portal .card,.site-portal .loginCard,.site-portal .panel,.site-portal .field,.site-portal .authGateCard,.site-portal .examplePanel,
.site-legal .policy-section{background:#0d0f10!important;color:#fff!important;border-color:#292c2e!important;box-shadow:none!important}
.site-form .side{background:var(--411-pink)!important;color:#fff!important;border-color:var(--411-pink)!important}
.site-form .side p,.site-form .side .tiny,.site-form .side .hint{color:rgba(255,255,255,.82)!important}
.site-form input,.site-form textarea,.site-form select,.site-admin input,.site-admin textarea,.site-admin select,.site-portal input,.site-portal textarea,.site-portal select{background:#151819!important;color:#fff!important;border-color:#363a3d!important}
.site-form input::placeholder,.site-form textarea::placeholder,.site-admin input::placeholder,.site-portal input::placeholder{color:#777!important}
.site-form .btn.primary,.site-admin .action.green,.site-admin button:not(.plain):not(.filter):not(.tab):not(.switch),.site-portal .btn:not(.light):not(.secondary):not(.alt){background:var(--411-green)!important;color:#050607!important;border-color:var(--411-green)!important}
.site-form .btn.primary:hover,.site-admin .action.green:hover,.site-portal .btn:not(.light):not(.secondary):not(.alt):hover{background:var(--411-pink)!important;color:#fff!important;border-color:var(--411-pink)!important}
.site-admin .login,.site-portal .login,.site-portal .authGate{background:#050607!important}
.site-portal .sidebar{background:#050607!important;border-right:1px solid #242729!important}
.site-legal .policy-wrap{color:#e9e9e5!important}.site-legal .policy-footer{border-color:#292c2e!important;color:#8d9193!important}
.site-legal .policy-nav img{content:url('the411-brand-wordmark.svg')!important;max-height:52px!important;width:auto!important}
@media(max-width:800px){.site-public .site-nav{height:62px}.site-public .brand img{width:30px!important;height:30px!important}.site-form .side{background:#0d0f10!important;border-top:5px solid var(--411-pink)!important}}
.service-ticker{align-items:center;gap:0!important}.service-ticker b{display:block;padding:12px 28px;background:var(--411-pink);color:#fff;font-size:13px;white-space:nowrap;border-right:1px solid rgba(255,255,255,.25)}
