/* ── South Shore Collective Custom CSS ── */
html { scroll-behavior: smooth; }

/* Fixed nav: ensure body content doesn't hide behind it */
html body { padding-top: 3.5rem !important; } /* h-14 = 3.5rem */
.admin-bar body { padding-top: calc(3.5rem + 32px) !important; }

/* Ensure nav stays fixed above everything */
nav.fixed, nav[style*="position:fixed"] {
    position: fixed !important;
    z-index: 9999 !important;
}
/* Admin bar: push nav down 32px */
.admin-bar nav.fixed,
.admin-bar nav[style*="position:fixed"] {
    top: 32px !important;
}
/* No admin bar: nav at top */
body:not(.admin-bar) nav.fixed,
body:not(.admin-bar) nav[style*="position:fixed"] {
    top: 0 !important;
}

/* Homepage hero desktop media clearance under fixed nav */
@media (min-width: 1024px) {
    .home-hero .home-hero-media { margin-top: 0.75rem; }
}
@media (min-width: 1536px) {
    .home-hero .home-hero-media { margin-top: 1.5rem; }
}

/* Mobile submenu display helper */
#mobile-platform-submenu { flex-direction: column; }
#mobile-platform-submenu svg { width: 0.875rem !important; height: 0.875rem !important; max-width: none; max-height: none; }

/* Global: prevent SVGs inside upload boxes from expanding */
.border-dashed svg {
    width: 2rem !important;
    height: 2rem !important;
    max-width: 2rem;
    max-height: 2rem;
    flex-shrink: 0;
}

/* Local Search hardening: prevent oversize icons if Tailwind utility classes are missing */
body.page-template-page-local-search svg.w-6,
body.page-template-page-local-search svg.h-6,
body.page-template-page-local-search #citation-search-form svg.w-4,
body.page-template-page-local-search #citation-search-form svg.h-4 {
    max-width: 1.5rem;
    max-height: 1.5rem;
}
body.page-template-page-local-search .bg-accent\/10.flex.items-center.justify-center {
    width: 3.5rem;
    height: 3.5rem;
}

/* Scroll animations */
.animate-on-scroll { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease, transform 0.6s ease; }
.animate-on-scroll.is-visible { opacity: 1; transform: translateY(0); }
.stagger-item { opacity: 0; transform: translateY(15px); transition: opacity 0.5s ease, transform 0.5s ease; }
.animate-on-scroll.is-visible .stagger-item { opacity: 1; transform: translateY(0); }
.animate-on-scroll.is-visible .stagger-item:nth-child(1) { transition-delay: 0s; }
.animate-on-scroll.is-visible .stagger-item:nth-child(2) { transition-delay: 0.08s; }
.animate-on-scroll.is-visible .stagger-item:nth-child(3) { transition-delay: 0.16s; }
.animate-on-scroll.is-visible .stagger-item:nth-child(4) { transition-delay: 0.24s; }
.animate-on-scroll.is-visible .stagger-item:nth-child(5) { transition-delay: 0.32s; }
.animate-on-scroll.is-visible .stagger-item:nth-child(6) { transition-delay: 0.4s; }

/* Grain overlay */
.grain-overlay { position: relative; }
.grain-overlay::after {
    content: ''; position: absolute; inset: 0; opacity: 0.03; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-repeat: repeat; background-size: 256px;
}

/* Editorial rules */
.editorial-rule { width: 3rem; height: 1px; background: hsl(220 20% 12% / 0.2); }
.editorial-rule-accent { width: 3rem; height: 2px; background: hsl(170 50% 32%); }

/* Section padding — tighter on mobile */
.section-padding { padding: 3.5rem 1.25rem; }
@media (min-width: 768px) { .section-padding { padding: 6rem 2rem; } }
@media (min-width: 1024px) { .section-padding { padding: 8rem 4rem; } }

/* Line clamp utility */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Portfolio card thumbnail — bulletproof 4:3 aspect ratio */
.portfolio-thumb {
    position: relative;
    width: 100%;
    padding-bottom: 66.67%;
    overflow: hidden;
}
.portfolio-thumb img {
    object-position: center center;
}

/* Portfolio media safety classes (do not rely on Tailwind build output) */
.ssc-media-contain {
    object-fit: contain !important;
    object-position: center center !important;
}
.ssc-media-cover {
    object-fit: cover !important;
    object-position: top center !important;
}
.ssc-media-padded {
    padding: 0.75rem;
}

/* Portfolio hero search box spacing */
.grain-overlay form.flex {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}
.grain-overlay form.flex input[type="text"] {
    padding: 0.625rem 1rem 0.625rem 2.5rem;
    border-radius: 0.25rem;
}
.grain-overlay form.flex button[type="submit"] {
    padding: 0.625rem 1.25rem;
    border-radius: 0.25rem;
}

/* Portfolio: breathing room between filters and project count */
.sticky.z-40.border-b + section,
.sticky.z-40.border-b + .bg-background {
    padding-top: 2.5rem;
}
@media (min-width: 768px) {
    .sticky.z-40.border-b + section,
    .sticky.z-40.border-b + .bg-background {
        padding-top: 3rem;
    }
}

/* Portfolio grid section — ensure breathing room before pagination/CTA */
.ssc-pagination {
    margin-top: 4rem;
    padding-top: 2.5rem;
    margin-bottom: 1rem;
}

/* ── Listing pages (Gigs, Jobs): filter bar to grid spacing ── */
.border-b.border-border + .section-padding {
    padding-top: 2.5rem;
}
@media (min-width: 768px) {
    .border-b.border-border + .section-padding {
        padding-top: 3.5rem;
    }
}
/* Gig/Job listing header hero — extra bottom padding for breathing room */
.bg-primary.section-padding.grain-overlay + .border-b {
    border-top: none;
}

/* Search overlay */
.search-overlay {
    position: fixed; inset: 0; z-index: 99999;
    background: hsl(var(--background) / 0.97);
    backdrop-filter: blur(12px);
    animation: search-enter 0.25s ease-out;
}
.search-overlay.hidden { display: none; }
.search-overlay-inner {
    position: relative;
    display: flex; align-items: center; justify-content: center;
    min-height: 100vh; padding: 2rem 0;
}
@keyframes search-enter {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Services dropdown — solid opaque panel with elegant shadow */
.services-dropdown {
    background: hsl(var(--background));
    box-shadow:
        0 20px 60px -15px rgba(0, 0, 0, 0.25),
        0 0 0 1px hsl(var(--border));
    backdrop-filter: none;
    animation: dropdown-enter 0.2s ease-out;
    width: 640px !important;
}
.services-dropdown > div {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
@keyframes dropdown-enter {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ── Arbitrary Tailwind values not in compiled CSS ── */

/* Tracking (letter-spacing) */
.tracking-\[0\.2em\]  { letter-spacing: 0.2em; }
.tracking-\[0\.25em\] { letter-spacing: 0.25em; }
.tracking-\[0\.08em\] { letter-spacing: 0.08em; }

/* Leading (line-height) */
.leading-\[0\.95\]    { line-height: 0.95; }
.leading-\[1\.05\]    { line-height: 1.05; }

/* Font sizes */
.text-\[8rem\]        { font-size: 8rem; }
.text-\[9px\]         { font-size: 9px; }
.text-\[10px\]        { font-size: 10px; }
.text-\[11px\]        { font-size: 11px; }
.text-\[2\.25rem\]    { font-size: 2.25rem; }
@media (min-width: 768px) {
    .md\:text-\[12rem\] { font-size: 12rem; }
}

/* Widths & Heights */
.w-\[80px\]           { width: 80px; }
.h-\[80px\]           { height: 80px; }
.h-\[60px\]           { height: 60px; }
.h-\[180px\]          { height: 180px; }

/* Min-heights */
.min-h-\[24px\]       { min-height: 24px; }
.min-h-\[85vh\]       { min-height: 85vh; }
.min-h-\[60vh\]       { min-height: 60vh; }
.min-h-\[300px\]      { min-height: 300px; }

/* Positioning */
.left-\[23px\]        { left: 23px; }
@media (min-width: 768px) {
    .md\:left-\[27px\] { left: 27px; }
}

/* Aspect ratios */
.aspect-\[16\/9\]     { aspect-ratio: 16/9; }
.aspect-\[4\/3\]      { aspect-ratio: 4/3; }
.aspect-\[4\/5\]      { aspect-ratio: 4/5; }
.aspect-\[3\/2\]      { aspect-ratio: 3/2; }
@media (min-width: 768px) {
    .md\:aspect-\[21\/9\] { aspect-ratio: 21/9; }
}


/* ══════════════════════════════════════════════════════
   SHARED LANDING PAGE STYLES (Build, Grow, Automate, Sell)
   ══════════════════════════════════════════════════════ */

/* ── LP Hero (shared across all service pages) ── */
.lp-hero {
    position: relative;
    overflow: hidden;
}
.lp-hero--build   { background: linear-gradient(135deg, hsl(220 30% 15%), hsl(220 25% 25%), hsl(215 20% 18%)); }
.lp-hero--grow    { background: linear-gradient(135deg, hsl(160 35% 14%), hsl(170 30% 22%), hsl(180 25% 16%)); }
.lp-hero--automate{ background: linear-gradient(135deg, hsl(260 30% 16%), hsl(250 25% 24%), hsl(270 20% 18%)); }
.lp-hero--sell    { background: linear-gradient(135deg, hsl(25 40% 16%), hsl(30 35% 24%), hsl(20 30% 18%)); }
.lp-hero--merchant{ background: linear-gradient(135deg, hsl(200 40% 14%), hsl(195 35% 22%), hsl(205 30% 16%)); }
.lp-hero--payroll { background: linear-gradient(135deg, hsl(140 30% 14%), hsl(145 25% 22%), hsl(135 20% 17%)); }
.lp-hero--apparel { background: linear-gradient(135deg, hsl(215 45% 18%), hsl(220 35% 26%), hsl(210 30% 20%)); }

.lp-hero-grain {
    position: absolute; inset: 0; z-index: 1;
    opacity: 0.04; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 256px;
}
.lp-hero-inner {
    position: relative; z-index: 2;
    padding-top: 5rem; padding-bottom: 3.5rem;
}
@media (min-width: 768px) { .lp-hero-inner { padding-top: 8rem; padding-bottom: 6rem; } }
@media (min-width: 1024px) { .lp-hero-inner { padding-top: 10rem; padding-bottom: 7rem; } }

.lp-hero-h1 {
    font-size: 2rem; line-height: 1.05; color: #fff; margin-bottom: 1.25rem;
}
@media (min-width: 768px) { .lp-hero-h1 { font-size: 3.25rem; margin-bottom: 1.5rem; } }
@media (min-width: 1024px) { .lp-hero-h1 { font-size: 4.5rem; } }

.lp-hero-sub {
    font-size: 0.9375rem; color: rgba(255,255,255,0.7);
    max-width: 36rem; margin-bottom: 2rem; line-height: 1.7;
}
@media (min-width: 768px) { .lp-hero-sub { font-size: 1.125rem; margin-bottom: 2.5rem; } }

.lp-hero-cta {
    display: inline-flex; align-items: center; justify-content: center;
    background: hsl(170 50% 32%); color: #fff;
    padding: 0.75rem 1.5rem;
    font-family: 'Space Grotesk', sans-serif; font-size: 0.8rem;
    font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;
    text-decoration: none; transition: background 0.2s ease;
}
@media (min-width: 768px) { .lp-hero-cta { padding: 1rem 2rem; font-size: 0.875rem; } }
.lp-hero-cta:hover { background: hsl(170 50% 28%); }

/* Stats bar (shared) */
.lp-stats-bar {
    margin-top: 2.5rem; padding-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.1);
}
@media (min-width: 768px) { .lp-stats-bar { margin-top: 4rem; padding-top: 2rem; } }
.lp-stat-num { font-size: 1.5rem; color: #fff; }
@media (min-width: 768px) { .lp-stat-num { font-size: 2.25rem; } }
.lp-stat-label { font-size: 0.75rem; color: rgba(255,255,255,0.5); margin-top: 0.125rem; }
@media (min-width: 768px) { .lp-stat-label { font-size: 0.875rem; margin-top: 0.25rem; } }

/* Service cards */
.lp-service-card {
    background: hsl(var(--background));
    border: 1px solid hsl(var(--border));
    padding: 1.5rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.lp-service-card:hover {
    border-color: hsla(170, 50%, 32%, 0.4);
    box-shadow: 0 8px 30px -10px rgba(0, 0, 0, 0.08);
}

/* ══════════════════════════════════════════════════════
   BUSINESS FUNDING PAGE
   ══════════════════════════════════════════════════════ */

/* ── Hero ── */
.funding-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, hsl(215 45% 18%), hsl(215 35% 28%), hsl(220 25% 18%));
}
.funding-hero-grain {
    position: absolute; inset: 0; z-index: 1;
    opacity: 0.04; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 256px;
}
.funding-hero-inner {
    position: relative; z-index: 2;
    padding-top: 5rem; padding-bottom: 3.5rem;
}
@media (min-width: 768px) {
    .funding-hero-inner { padding-top: 8rem; padding-bottom: 6rem; }
}
@media (min-width: 1024px) {
    .funding-hero-inner { padding-top: 10rem; padding-bottom: 7rem; }
}
.funding-hero-h1 {
    font-size: 2rem; line-height: 1.05; color: #fff; margin-bottom: 1.25rem;
}
@media (min-width: 768px) { .funding-hero-h1 { font-size: 3.25rem; margin-bottom: 1.5rem; } }
@media (min-width: 1024px) { .funding-hero-h1 { font-size: 4.5rem; } }

.funding-hero-sub {
    font-size: 0.9375rem; color: rgba(255,255,255,0.7);
    max-width: 36rem; margin-bottom: 2rem; line-height: 1.7;
}
@media (min-width: 768px) { .funding-hero-sub { font-size: 1.125rem; margin-bottom: 2.5rem; } }

.funding-hero-cta {
    display: inline-flex; align-items: center; justify-content: center;
    background: hsl(170 50% 32%); color: #fff;
    padding: 0.75rem 1.5rem;
    font-family: 'Space Grotesk', sans-serif; font-size: 0.8rem;
    font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;
    text-decoration: none;
    transition: background 0.2s ease;
}
@media (min-width: 768px) {
    .funding-hero-cta { padding: 1rem 2rem; font-size: 0.875rem; }
}
.funding-hero-cta:hover { background: hsl(170 50% 28%); }

/* Trust bar */
.funding-trust-bar {
    margin-top: 2.5rem; padding-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.1);
}
@media (min-width: 768px) {
    .funding-trust-bar { margin-top: 4rem; padding-top: 2rem; }
}
.funding-stat-num {
    font-size: 1.5rem; color: #fff;
}
@media (min-width: 768px) { .funding-stat-num { font-size: 2.25rem; } }
.funding-stat-label {
    font-size: 0.75rem; color: rgba(255,255,255,0.5); margin-top: 0.125rem;
}
@media (min-width: 768px) { .funding-stat-label { font-size: 0.875rem; margin-top: 0.25rem; } }

/* ── How It Works — Step circles ── */
.funding-circle {
    width: 3.5rem; height: 3.5rem; border-radius: 50%;
    background: hsla(170, 50%, 32%, 0.1);
    display: flex; align-items: center; justify-content: center;
}
.funding-circle span {
    font-family: 'Instrument Serif', serif;
    font-size: 1.25rem; color: hsl(170 50% 32%);
}

/* Success circle */
.funding-circle-lg {
    width: 4rem; height: 4rem; border-radius: 50%;
    background: hsla(170, 50%, 32%, 0.1);
    display: flex; align-items: center; justify-content: center;
}
.funding-check-icon-lg { width: 2rem; height: 2rem; color: hsl(170 50% 32%); }

/* ── Funding Options section bg ── */
.funding-options-bg {
    background: hsl(35 15% 88% / 0.3);
}

/* Product cards */
.funding-product-card {
    background: hsl(var(--background));
    border: 1px solid hsl(var(--border));
    padding: 1.5rem;
    transition: border-color 0.2s ease;
}
.funding-product-card:hover {
    border-color: hsla(170, 50%, 32%, 0.4);
}
.funding-product-badge {
    font-size: 0.75rem; font-weight: 600;
    color: hsl(170 50% 32%);
    background: hsla(170, 50%, 32%, 0.1);
    padding: 0.25rem 0.5rem;
    white-space: nowrap;
}

/* Testimonial cards */
.funding-testimonial-card {
    background: hsl(var(--background));
    border: 1px solid hsl(var(--border));
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.funding-testimonial-card:hover {
    border-color: hsla(170, 50%, 32%, 0.3);
    box-shadow: 0 8px 30px -10px rgba(0, 0, 0, 0.08);
}

/* ── Form card ── */
.funding-form-card {
    background: hsl(var(--background));
    border: 1px solid hsl(var(--border));
    padding: 1.25rem;
    box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.08);
}
@media (min-width: 768px) {
    .funding-form-card { padding: 2.5rem; }
}

/* Form steps - show/hide */
.funding-form-step { display: none; }
.funding-form-step.active { display: block; animation: step-fade 0.3s ease; }
@keyframes step-fade {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Progress indicator */
.funding-step {
    display: flex; flex-direction: column; align-items: center; gap: 0.5rem; position: relative;
}
.funding-step-dot {
    width: 2.25rem; height: 2.25rem; border-radius: 50%;
    border: 2px solid hsl(var(--border));
    display: flex; align-items: center; justify-content: center;
    font-family: 'Space Grotesk', sans-serif; font-size: 0.8rem; font-weight: 600;
    color: hsl(var(--muted-foreground));
    background: hsl(var(--background));
    transition: all 0.3s ease;
}
.funding-step.active .funding-step-dot {
    border-color: hsl(var(--accent));
    color: hsl(var(--accent));
    box-shadow: 0 0 0 4px hsla(170, 50%, 32%, 0.12);
}
.funding-step.completed .funding-step-dot {
    background: hsl(var(--accent));
    border-color: hsl(var(--accent));
    color: white;
}
.funding-step-label {
    font-family: 'Space Grotesk', sans-serif; font-size: 0.7rem;
    text-transform: uppercase; letter-spacing: 0.08em;
    color: hsl(var(--muted-foreground));
    white-space: nowrap;
}
.funding-step.active .funding-step-label { color: hsl(var(--foreground)); }
.funding-step-line {
    flex: 1; height: 2px; min-width: 3rem;
    background: hsl(var(--border));
    margin-top: -1.2rem;
    transition: background 0.3s ease;
}
.funding-step-line.completed { background: hsl(var(--accent)); }

/* Inputs */
.funding-label {
    display: block; font-family: 'Space Grotesk', sans-serif;
    font-size: 0.8rem; font-weight: 500;
    color: hsl(var(--foreground));
    margin-bottom: 0.4rem;
}
.funding-input {
    width: 100%; height: 2.75rem;
    padding: 0 0.875rem;
    border: 1px solid hsl(var(--border));
    background: hsl(var(--background));
    color: hsl(var(--foreground));
    font-family: 'Space Grotesk', sans-serif; font-size: 0.875rem;
    transition: border-color 0.2s ease;
    -webkit-appearance: none; appearance: none;
    border-radius: 0;
}
.funding-input:focus {
    outline: none;
    border-color: hsl(var(--accent));
    box-shadow: 0 0 0 3px hsla(170, 50%, 32%, 0.1);
}
.funding-input-error {
    border-color: hsl(0 72% 51%) !important;
    box-shadow: 0 0 0 3px hsla(0, 72%, 51%, 0.1) !important;
}
select.funding-input {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    padding-right: 2.5rem;
}

/* Upload zones */
.funding-upload-zone {
    border: 2px dashed hsl(var(--border));
    padding: 1.5rem; cursor: pointer;
    text-align: center; position: relative;
    transition: all 0.2s ease;
}
.funding-upload-zone:hover,
.funding-upload-zone.drag-over {
    border-color: hsl(var(--accent));
    background: hsla(170, 50%, 32%, 0.03);
}
.funding-upload-zone.has-file {
    border-style: solid;
    border-color: hsla(170, 50%, 32%, 0.4);
    background: hsla(170, 50%, 32%, 0.04);
}
.funding-upload-content {
    display: flex; flex-direction: column; align-items: center; gap: 0.25rem;
}
.funding-upload-icon {
    width: 1.5rem; height: 1.5rem; color: hsl(var(--muted-foreground)); margin-bottom: 0.5rem;
}
.funding-upload-hint {
    font-size: 0.7rem; color: hsl(var(--muted-foreground)); opacity: 0.6;
}
.funding-upload-success {
    display: flex; align-items: center; gap: 0.5rem; justify-content: center;
}
.funding-check-icon {
    width: 1.25rem; height: 1.25rem; color: hsl(170 50% 32%);
}
.funding-file-input {
    position: absolute; inset: 0; opacity: 0; cursor: pointer;
    width: 100%; height: 100%;
}

/* Consent checkbox */
.funding-consent {
    display: flex; align-items: flex-start; gap: 0.75rem; cursor: pointer;
}
.funding-checkbox {
    margin-top: 0.25rem; width: 1rem; height: 1rem;
    accent-color: hsl(170 50% 32%);
    border: 1px solid hsl(var(--border));
    flex-shrink: 0;
}

/* Buttons */
.funding-btn-next,
.funding-btn-submit {
    display: inline-flex; align-items: center; justify-content: center;
    background: hsl(170 50% 32%); color: white;
    padding: 0.75rem 2rem;
    font-family: 'Space Grotesk', sans-serif; font-size: 0.8rem;
    font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;
    border: none; cursor: pointer;
    transition: background 0.2s ease;
}
.funding-btn-next:hover,
.funding-btn-submit:hover { background: hsl(170 50% 28%); }
.funding-btn-submit:disabled { opacity: 0.6; cursor: not-allowed; }
.funding-btn-back {
    display: inline-flex; align-items: center;
    background: none; border: 1px solid hsl(var(--border));
    padding: 0.75rem 1.5rem;
    font-family: 'Space Grotesk', sans-serif; font-size: 0.8rem;
    font-weight: 500; color: hsl(var(--muted-foreground));
    cursor: pointer; transition: all 0.2s ease;
}
.funding-btn-back:hover {
    border-color: hsl(var(--foreground));
    color: hsl(var(--foreground));
}

/* Trust signals */
.funding-trust-signals {
    margin-top: 3rem;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: 1.5rem;
    font-size: 0.75rem; color: hsl(var(--muted-foreground));
    font-family: 'Space Grotesk', sans-serif;
}
.funding-trust-item {
    display: flex; align-items: center; gap: 0.375rem;
}
.funding-trust-icon {
    width: 1rem; height: 1rem; color: hsl(170 50% 32%);
}

/* Bottom CTA */
.funding-bottom-cta {
    background: hsl(var(--foreground));
}
.funding-bottom-sub {
    color: hsla(40, 25%, 95%, 0.6);
}

/* FAQ */
.faq-chevron { transition: transform 0.2s ease; }
.rotate-180 { transform: rotate(180deg); }
.faq-toggle { background: none; border: none; cursor: pointer; }

/* ══════════════════════════════════════════════════════
   MOBILE POLISH — Global & Homepage
   ══════════════════════════════════════════════════════ */
@media (max-width: 767px) {
    /* Homepage hero hard-fix: avoid collapsed first section on mobile */
    .home-hero {
        min-height: calc(100vh - 3.5rem) !important;
        min-height: calc(100svh - 3.5rem) !important;
        min-height: calc(100dvh - 3.5rem) !important;
    }
    .home-hero-inner {
        width: 100%;
        padding-top: 1.5rem;
        padding-bottom: 2rem;
    }
    /* Ensure animate-on-scroll children are visible even if observer misses */
    /* If intersection observer misses on some mobile/private contexts, keep hero visible */
    .home-hero .animate-on-scroll {
        opacity: 1;
        transform: none;
    }

    /* Primary hero sections — prevent collapse across mobile browsers/modes */
    body.home section.min-h-screen,
    body.page-template-page-marketplace section.min-h-screen,
    body.page-template-page-marketplace section.min-h-\[85vh\],
    section.min-h-screen,
    section.min-h-\[85vh\] {
        min-height: 90vh !important;
        min-height: calc(100vh - 3.5rem) !important;
        min-height: calc(100svh - 3.5rem) !important;
        min-height: calc(100dvh - 3.5rem) !important;
    }

    /* Mobile nav: keep panel anchored in viewport, not off-screen */
    nav.fixed { overflow: visible !important; }
    #mobile-menu {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        max-height: calc(100dvh - 3.5rem);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        border-bottom: 1px solid hsl(var(--border));
    }
    .admin-bar #mobile-menu {
        max-height: calc(100dvh - 3.5rem - 32px);
    }

    /* Tighter heading margins on mobile */
    .mb-16 { margin-bottom: 2.5rem; }
    .mb-14 { margin-bottom: 2rem; }
    .mb-12 { margin-bottom: 2rem; }
    
    /* Package cards: less padding on mobile */
    #packages .grid > div { padding: 1.5rem; }
    
    /* Marketing packages AI grid */
    #packages .grid.sm\:grid-cols-2 { gap: 1px; }
    
    /* Social dashboard: tighter card padding */
    #social-dashboard .border.border-border.bg-card { padding: 1rem; }
    #social-dashboard .border.border-border.bg-card .mb-8 { margin-bottom: 1.25rem; }
    
    /* Brand reputation dashboard */
    #brand-reputation .border.border-primary-foreground\/10.bg-navy-deep { padding: 1rem; }
    
    /* CTA section: tighter mobile padding */
    .relative.grain-overlay .flex.items-center.bg-primary { padding: 2rem 1.25rem; }
    
    /* Growth planner step buttons */
    .planner-option { padding: 0.75rem 1rem; font-size: 0.8125rem; }
    
    /* Funding page form — progress dots smaller */
    .funding-step-dot { width: 1.75rem; height: 1.75rem; font-size: 0.7rem; }
    .funding-step-label { font-size: 0.6rem; }
    .funding-step-line { min-width: 1.5rem; }
    
    /* Funding form buttons: full width on mobile */
    .funding-btn-next,
    .funding-btn-submit { width: 100%; padding: 0.875rem 1.5rem; }
    .funding-btn-back { padding: 0.875rem 1.25rem; }
    
    /* Upload zones: tighter on mobile */
    .funding-upload-zone { padding: 1rem; }
    
    /* Testimonial cards on funding page */
    .funding-testimonial-card { padding: 1.25rem; }
    
    /* Stats bar boxes */
    .funding-testimonial-card + .funding-testimonial-card { margin-top: 0; }
    
    /* Trust signals wrap better */
    .funding-trust-signals { flex-direction: column; gap: 0.75rem; align-items: flex-start; }
    
    /* FAQ toggle */
    .faq-toggle span { font-size: 1rem; }
    
    /* Inputs: slightly taller touch targets */
    .funding-input { height: 3rem; font-size: 1rem; }

    /* ── Landing Page Mobile Fixes ── */

    /* Hero CTAs: full width on mobile */
    .lp-hero-cta,
    .funding-hero-cta {
        width: 100%;
        text-align: center;
    }

    /* Stats bar: prevent label overflow */
    .lp-stat-num { font-size: 1.25rem; }
    .lp-stat-label { font-size: 0.6875rem; line-height: 1.3; }
    .funding-stat-num { font-size: 1.25rem; }
    .funding-stat-label { font-size: 0.6875rem; line-height: 1.3; }

    /* Service cards: tighter padding */
    .lp-service-card { padding: 1.25rem; }

    /* Bottom CTA buttons: full width on mobile */
    .funding-bottom-cta .funding-hero-cta {
        width: 100%;
        max-width: 20rem;
    }

    /* Product cards tighter */
    .funding-product-card { padding: 1.25rem; }
    .funding-product-badge { font-size: 0.6875rem; padding: 0.125rem 0.375rem; }

    /* Process step numbers: slightly smaller */
    .text-3xl.text-accent\/30 { font-size: 1.5rem; }

}

/* ── Pagination ── */
.ssc-pagination a,
.ssc-pagination span.current {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0 0.75rem;
    font-family: var(--font-body, sans-serif);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border: 1px solid hsl(var(--border));
    color: hsl(var(--muted-foreground));
    background: transparent;
    transition: all 0.2s ease;
}
.ssc-pagination a:hover {
    border-color: hsl(var(--foreground));
    color: hsl(var(--foreground));
}
.ssc-pagination span.current {
    background: hsl(var(--foreground));
    color: hsl(var(--background));
    border-color: hsl(var(--foreground));
}
.ssc-pagination a.prev,
.ssc-pagination a.next {
    gap: 0.5rem;
    padding: 0 1rem;
}
.ssc-pagination .dots {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2.5rem;
    font-size: 0.75rem;
    color: hsl(var(--muted-foreground));
    letter-spacing: 0.15em;
}

/* ── Portfolio Single — prose styling ── */
.portfolio-prose p { margin-bottom: 1.25rem; }
.portfolio-prose h2 { font-family: 'Instrument Serif', serif; font-size: 1.75rem; color: hsl(var(--foreground)); margin: 2rem 0 0.75rem; }
.portfolio-prose h3 { font-family: 'Instrument Serif', serif; font-size: 1.25rem; color: hsl(var(--foreground)); margin: 1.5rem 0 0.5rem; }
.portfolio-prose ul, .portfolio-prose ol { padding-left: 1.5rem; margin-bottom: 1.25rem; }
.portfolio-prose li { margin-bottom: 0.5rem; }
.portfolio-prose a { color: hsl(170 50% 32%); text-decoration: underline; }
.portfolio-prose a:hover { color: hsl(var(--foreground)); }
.portfolio-prose img { width: 100%; height: auto; margin: 1.5rem 0; }
.portfolio-prose strong { color: hsl(var(--foreground)); font-weight: 600; }

/* ══════════════════════════════════════════════════════
   CHATBOT WIDGET
   ══════════════════════════════════════════════════════ */

#ssc-chat { position: fixed; bottom: 1.25rem; right: 1.25rem; z-index: 9998; font-family: 'Space Grotesk', sans-serif; }

/* FAB button */
#ssc-chat-fab {
    width: 3.5rem; height: 3.5rem; border-radius: 50%;
    background: hsl(220 20% 14%); color: #fff;
    border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 20px rgba(0,0,0,0.25);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
#ssc-chat-fab:hover { transform: scale(1.08); box-shadow: 0 6px 28px rgba(0,0,0,0.3); }

/* Panel */
#ssc-chat-panel {
    position: absolute; bottom: 4.5rem; right: 0;
    width: 360px; max-width: calc(100vw - 2rem);
    max-height: calc(100vh - 8rem); max-height: calc(100dvh - 8rem);
    background: hsl(var(--background));
    border: 1px solid hsl(var(--border));
    box-shadow: 0 20px 60px -15px rgba(0,0,0,0.25);
    display: flex; flex-direction: column;
    overflow: hidden;
    animation: ssc-chat-enter 0.25s ease-out;
}
@keyframes ssc-chat-enter {
    from { opacity: 0; transform: translateY(10px) scale(0.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Header */
#ssc-chat-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.875rem 1rem;
    background: hsl(220 20% 14%); color: #fff;
}
.ssc-chat-header-info { display: flex; align-items: center; gap: 0.625rem; }
.ssc-chat-avatar {
    width: 2.25rem; height: 2.25rem; border-radius: 50%;
    background: hsl(170 50% 32%); display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
.ssc-chat-header-name { font-size: 0.875rem; font-weight: 600; }
.ssc-chat-header-status { font-size: 0.625rem; opacity: 0.6; }
#ssc-chat-minimize { background: none; border: none; color: rgba(255,255,255,0.5); cursor: pointer; padding: 0.25rem; }
#ssc-chat-minimize:hover { color: #fff; }

/* Messages area */
#ssc-chat-messages {
    flex: 1; overflow-y: auto; padding: 1rem;
    display: flex; flex-direction: column; gap: 0.5rem;
    min-height: 200px; max-height: 350px;
}
.ssc-chat-msg {
    max-width: 85%; padding: 0.625rem 0.875rem;
    font-size: 0.8125rem; line-height: 1.5;
    animation: ssc-msg-in 0.2s ease-out;
}
@keyframes ssc-msg-in {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}
.ssc-chat-msg--bot {
    align-self: flex-start;
    background: hsl(var(--muted));
    color: hsl(var(--foreground));
    border-radius: 0 0.75rem 0.75rem 0.75rem;
}
.ssc-chat-msg--user {
    align-self: flex-end;
    background: hsl(220 20% 14%);
    color: #fff;
    border-radius: 0.75rem 0 0.75rem 0.75rem;
}

/* Typing indicator */
.ssc-chat-typing {
    display: flex; gap: 0.25rem; padding: 0.75rem 1rem !important;
}
.ssc-chat-typing span {
    width: 6px; height: 6px; border-radius: 50%;
    background: hsl(var(--muted-foreground));
    animation: ssc-typing 1.2s ease-in-out infinite;
}
.ssc-chat-typing span:nth-child(2) { animation-delay: 0.2s; }
.ssc-chat-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes ssc-typing {
    0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
    30% { opacity: 1; transform: translateY(-4px); }
}

/* Quick replies */
#ssc-chat-quick {
    display: flex; flex-wrap: wrap; gap: 0.375rem;
    padding: 0 1rem 0.75rem;
}
.ssc-chat-qr {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem; font-weight: 500;
    border: 1px solid hsl(var(--border));
    background: hsl(var(--background));
    color: hsl(var(--foreground));
    cursor: pointer; border-radius: 1rem;
    transition: all 0.15s ease;
    white-space: nowrap;
}
.ssc-chat-qr:hover { border-color: hsl(170 50% 32%); color: hsl(170 50% 32%); }
.ssc-chat-qr--accent {
    background: hsl(170 50% 32%); color: #fff; border-color: hsl(170 50% 32%);
}
.ssc-chat-qr--accent:hover { background: hsl(170 50% 28%); color: #fff; }
.ssc-chat-qr--outline { border-style: dashed; }

/* Input */
#ssc-chat-input-wrap {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid hsl(var(--border));
}
#ssc-chat-input {
    flex: 1; border: none; outline: none; background: transparent;
    font-family: 'Space Grotesk', sans-serif; font-size: 0.8125rem;
    color: hsl(var(--foreground));
}
#ssc-chat-input::placeholder { color: hsl(var(--muted-foreground)); }
#ssc-chat-send {
    background: none; border: none; color: hsl(170 50% 32%);
    cursor: pointer; padding: 0.25rem;
    transition: color 0.15s;
}
#ssc-chat-send:hover { color: hsl(var(--foreground)); }

/* Nudge bubble */
#ssc-chat-nudge {
    position: absolute; bottom: 4.5rem; right: 0;
    background: hsl(var(--background));
    border: 1px solid hsl(var(--border));
    box-shadow: 0 8px 30px -10px rgba(0,0,0,0.2);
    padding: 0.75rem 1rem;
    font-size: 0.8125rem; color: hsl(var(--foreground));
    white-space: nowrap;
    display: flex; align-items: center; gap: 0.5rem;
    cursor: pointer;
    animation: ssc-chat-enter 0.3s ease-out;
}
#ssc-chat-nudge-close {
    background: none; border: none; color: hsl(var(--muted-foreground));
    cursor: pointer; font-size: 1.125rem; padding: 0;
}

/* Mobile adjustments */
@media (max-width: 480px) {
    #ssc-chat-panel {
        width: calc(100vw - 1.5rem);
        bottom: 4rem; right: -0.5rem;
    }
    #ssc-chat-fab { width: 3rem; height: 3rem; }
    #ssc-chat { bottom: 1rem; right: 0.75rem; }
}

/* Admin bar adjustment */
.admin-bar #ssc-chat { bottom: calc(1.25rem + 32px); }
