/*
|--------------------------------------------------------------------------
| ADOWLA APFS v1.0 — Master Homepage Foundation
|--------------------------------------------------------------------------
| P3-A1-R2
| Isolated homepage namespace.
|--------------------------------------------------------------------------
*/

.apfs-home-foundation {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    color: var(--apfs-text, #0f172a);
    background:
        radial-gradient(circle at 12% 10%, rgba(37, 99, 235, .09), transparent 31%),
        radial-gradient(circle at 88% 18%, rgba(15, 39, 68, .07), transparent 28%),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 55%, #ffffff 100%);
}

.apfs-home-foundation *,
.apfs-home-foundation *::before,
.apfs-home-foundation *::after {
    box-sizing: border-box;
}

.apfs-home-container {
    width: min(100% - 40px, 1240px);
    margin-inline: auto;
}

.apfs-home-hero {
    position: relative;
    padding: clamp(68px, 8vw, 112px) 0 50px;
}

.apfs-home-hero::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -140px;
    right: -110px;
    width: 420px;
    height: 420px;
    border-radius: 999px;
    background: rgba(37, 99, 235, .055);
}

.apfs-home-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(330px, .88fr);
    gap: clamp(42px, 7vw, 88px);
    align-items: center;
}

.apfs-home-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 32px;
    padding: 6px 12px;
    margin-bottom: 20px;
    border: 1px solid var(--apfs-brand-border, #bfdbfe);
    border-radius: 999px;
    color: var(--apfs-brand, #2563eb);
    background: var(--apfs-brand-soft, #eff6ff);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.apfs-home-eyebrow-dot {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 999px;
    background: var(--apfs-brand, #2563eb);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .10);
}

.apfs-home-title {
    max-width: 790px;
    margin: 0;
    color: var(--apfs-navy, #0f2744);
    font-size: clamp(42px, 5.7vw, 72px);
    font-weight: 820;
    letter-spacing: -.045em;
    line-height: 1.03;
}

.apfs-home-title-accent {
    color: var(--apfs-brand, #2563eb);
}

.apfs-home-lead {
    max-width: 730px;
    margin: 24px 0 0;
    color: var(--apfs-text-secondary, #475569);
    font-size: clamp(17px, 1.7vw, 20px);
    line-height: 1.75;
}

.apfs-home-search-wrap {
    max-width: 760px;
    margin-top: 30px;
}

.apfs-home-search {
    display: flex;
    align-items: center;
    min-height: 62px;
    padding: 7px;
    border: 1px solid var(--apfs-border-strong, #cbd5e1);
    border-radius: 16px;
    background: #ffffff;
    box-shadow:
        0 18px 45px rgba(15, 39, 68, .09),
        0 2px 7px rgba(15, 39, 68, .04);
}

.apfs-home-search:focus-within {
    border-color: var(--apfs-brand, #2563eb);
    box-shadow:
        0 0 0 4px rgba(37, 99, 235, .10),
        0 18px 45px rgba(15, 39, 68, .09);
}

.apfs-home-search-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--apfs-muted, #64748b);
}

.apfs-home-search-input {
    width: 100%;
    min-width: 0;
    height: 46px;
    padding: 0 8px;
    border: 0;
    outline: 0;
    color: var(--apfs-text, #0f172a);
    background: transparent;
    font: inherit;
    font-size: 15px;
}

.apfs-home-search-input::placeholder {
    color: var(--apfs-muted, #64748b);
}

.apfs-home-search-button {
    min-width: 112px;
    height: 46px;
    padding: 0 20px;
    border: 1px solid var(--apfs-brand, #2563eb);
    border-radius: 11px;
    color: #ffffff;
    background: var(--apfs-brand, #2563eb);
    font: inherit;
    font-size: 14px;
    font-weight: 750;
    cursor: pointer;
    transition: background 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.apfs-home-search-button:hover {
    border-color: var(--apfs-brand-hover, #1d4ed8);
    background: var(--apfs-brand-hover, #1d4ed8);
}

.apfs-home-search-button:active {
    transform: translateY(1px);
}

.apfs-home-search-note {
    margin: 10px 2px 0;
    color: var(--apfs-muted, #64748b);
    font-size: 12px;
    line-height: 1.5;
}

.apfs-home-scope {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 17px;
}

.apfs-home-scope a {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 6px 11px;
    border: 1px solid var(--apfs-border, #e2e8f0);
    border-radius: 999px;
    color: var(--apfs-text-secondary, #475569);
    background: rgba(255, 255, 255, .82);
    text-decoration: none;
    font-size: 12px;
    font-weight: 680;
}

.apfs-home-scope a:hover,
.apfs-home-scope a:focus-visible {
    border-color: var(--apfs-brand-border, #bfdbfe);
    color: var(--apfs-brand, #2563eb);
    background: var(--apfs-brand-soft, #eff6ff);
    outline: none;
}

.apfs-home-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    margin-top: 26px;
}

.apfs-home-action {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border-radius: 11px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 750;
    transition: transform 150ms ease, box-shadow 150ms ease;
}

.apfs-home-action:hover {
    transform: translateY(-1px);
}

.apfs-home-action-primary {
    border: 1px solid var(--apfs-brand, #2563eb);
    color: #ffffff;
    background: var(--apfs-brand, #2563eb);
    box-shadow: 0 10px 24px rgba(37, 99, 235, .20);
}

.apfs-home-action-primary:hover {
    color: #ffffff;
    background: var(--apfs-brand-hover, #1d4ed8);
}

.apfs-home-action-secondary {
    border: 1px solid var(--apfs-border-strong, #cbd5e1);
    color: var(--apfs-navy, #0f2744);
    background: #ffffff;
}

.apfs-home-action-secondary:hover {
    border-color: var(--apfs-brand-border, #bfdbfe);
    color: var(--apfs-brand, #2563eb);
    background: var(--apfs-brand-soft, #eff6ff);
}

.apfs-home-hero-panel {
    padding: 20px;
    border: 1px solid var(--apfs-border, #e2e8f0);
    border-radius: 22px;
    background: rgba(255, 255, 255, .94);
    box-shadow:
        0 28px 70px rgba(15, 39, 68, .11),
        0 5px 16px rgba(15, 39, 68, .05);
}

.apfs-home-panel-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 4px 3px 17px;
}

.apfs-home-panel-title {
    color: var(--apfs-navy, #0f2744);
    font-size: 14px;
    font-weight: 800;
}

.apfs-home-panel-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--apfs-success, #16a34a);
    font-size: 11px;
    font-weight: 800;
}

.apfs-home-panel-status::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: currentColor;
}

.apfs-home-operating-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.apfs-home-operating-card {
    min-height: 98px;
    padding: 15px;
    border: 1px solid var(--apfs-border, #e2e8f0);
    border-radius: 13px;
    background: var(--apfs-surface-soft, #f8fafc);
}

.apfs-home-operating-icon {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 11px;
    border-radius: 9px;
    color: var(--apfs-brand, #2563eb);
    background: var(--apfs-brand-soft, #eff6ff);
    font-size: 13px;
    font-weight: 850;
}

.apfs-home-operating-card strong {
    display: block;
    color: var(--apfs-text, #0f172a);
    font-size: 13px;
}

.apfs-home-operating-card span {
    display: block;
    margin-top: 4px;
    color: var(--apfs-muted, #64748b);
    font-size: 11px;
    line-height: 1.45;
}

.apfs-home-panel-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 12px;
    padding: 13px 14px;
    border-radius: 12px;
    color: #ffffff;
    background: var(--apfs-navy, #0f2744);
}

.apfs-home-panel-footer strong {
    display: block;
    font-size: 12px;
}

.apfs-home-panel-footer span {
    display: block;
    margin-top: 3px;
    color: #cbd5e1;
    font-size: 10px;
}

.apfs-home-panel-footer-mark {
    color: #93c5fd;
    font-size: 18px;
    font-weight: 850;
}

.apfs-home-ecosystem {
    padding: 26px 0 clamp(66px, 8vw, 96px);
}

.apfs-home-section-head {
    max-width: 760px;
    margin-bottom: 28px;
}

.apfs-home-section-kicker {
    display: block;
    margin-bottom: 9px;
    color: var(--apfs-brand, #2563eb);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.apfs-home-section-title {
    margin: 0;
    color: var(--apfs-navy, #0f2744);
    font-size: clamp(29px, 3.5vw, 42px);
    font-weight: 810;
    letter-spacing: -.025em;
    line-height: 1.15;
}

.apfs-home-section-copy {
    max-width: 680px;
    margin: 12px 0 0;
    color: var(--apfs-text-secondary, #475569);
    font-size: 15px;
    line-height: 1.7;
}

.apfs-home-ecosystem-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
}

.apfs-home-ecosystem-card {
    position: relative;
    min-height: 210px;
    display: flex;
    flex-direction: column;
    padding: 22px;
    overflow: hidden;
    border: 1px solid var(--apfs-border, #e2e8f0);
    border-radius: 17px;
    color: inherit;
    background: #ffffff;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(15, 39, 68, .045);
    transition: transform 170ms ease, border-color 170ms ease, box-shadow 170ms ease;
}

.apfs-home-ecosystem-card::after {
    content: "";
    position: absolute;
    right: -34px;
    bottom: -45px;
    width: 120px;
    height: 120px;
    border-radius: 999px;
    background: var(--apfs-brand-soft, #eff6ff);
    opacity: .75;
}

.apfs-home-ecosystem-card:hover,
.apfs-home-ecosystem-card:focus-visible {
    transform: translateY(-3px);
    border-color: var(--apfs-brand-border, #bfdbfe);
    box-shadow: 0 18px 38px rgba(15, 39, 68, .09);
    outline: none;
}

.apfs-home-ecosystem-number {
    position: relative;
    z-index: 1;
    width: 39px;
    height: 39px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 19px;
    border: 1px solid var(--apfs-brand-border, #bfdbfe);
    border-radius: 11px;
    color: var(--apfs-brand, #2563eb);
    background: var(--apfs-brand-soft, #eff6ff);
    font-size: 12px;
    font-weight: 850;
}

.apfs-home-ecosystem-card h3 {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--apfs-navy, #0f2744);
    font-size: 19px;
    font-weight: 790;
}

.apfs-home-ecosystem-card p {
    position: relative;
    z-index: 1;
    margin: 9px 0 18px;
    color: var(--apfs-muted, #64748b);
    font-size: 13px;
    line-height: 1.65;
}

.apfs-home-ecosystem-link {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: auto;
    color: var(--apfs-brand, #2563eb);
    font-size: 12px;
    font-weight: 800;
}

.apfs-home-boundary {
    height: 1px;
    margin: 0;
    border: 0;
    background: linear-gradient(
        90deg,
        transparent,
        var(--apfs-border, #e2e8f0),
        transparent
    );
}

@media (max-width: 1080px) {
    .apfs-home-hero-grid {
        grid-template-columns: 1fr;
    }

    .apfs-home-hero-panel {
        max-width: 720px;
    }

    .apfs-home-ecosystem-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .apfs-home-container {
        width: min(100% - 28px, 1240px);
    }

    .apfs-home-hero {
        padding-top: 54px;
        padding-bottom: 36px;
    }

    .apfs-home-title {
        font-size: clamp(38px, 11vw, 54px);
    }

    .apfs-home-lead {
        font-size: 16px;
    }

    .apfs-home-search {
        flex-wrap: wrap;
        align-items: stretch;
    }

    .apfs-home-search-icon {
        width: 38px;
        flex-basis: 38px;
    }

    .apfs-home-search-input {
        width: calc(100% - 38px);
        flex: 1 1 calc(100% - 38px);
    }

    .apfs-home-search-button {
        width: 100%;
        margin-top: 4px;
    }

    .apfs-home-operating-grid,
    .apfs-home-ecosystem-grid {
        grid-template-columns: 1fr;
    }

    .apfs-home-ecosystem-card {
        min-height: 185px;
    }
}

@media (max-width: 430px) {
    .apfs-home-actions {
        display: grid;
    }

    .apfs-home-action {
        width: 100%;
    }

    .apfs-home-hero-panel {
        padding: 14px;
        border-radius: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .apfs-home-action,
    .apfs-home-search-button,
    .apfs-home-ecosystem-card {
        transition: none;
    }
}

/* ==========================================================================
   ADOWLA APFS v1.0
   P3-A2-A1-R2
   Professional International Soft Navy Blue Foundation

   A1 ownership only:
   - APFS master hero
   - Hero search
   - Connected platform panel
   - Ecosystem
   - Services / marketplace surface normalization
   ========================================================================== */

:root {
    --apfs-home-page: #F2F6FA;
    --apfs-home-hero-start: #E8F0F8;
    --apfs-home-hero-mid: #EDF3F9;
    --apfs-home-hero-end: #E3ECF6;
    --apfs-home-ecosystem: #E6EEF7;
    --apfs-home-marketplace: #EDF3F9;
    --apfs-home-soft-navy: #EAF0F7;
    --apfs-home-soft-navy-strong: #DDE7F1;
    --apfs-home-card: #FFFFFF;
    --apfs-home-card-soft: #F7F9FC;
    --apfs-home-heading: #0F2744;
    --apfs-home-body: #475569;
    --apfs-home-muted: #64748B;
    --apfs-home-primary: #2563EB;
    --apfs-home-primary-hover: #1D4ED8;
    --apfs-home-border: #D4E0EC;
    --apfs-home-border-blue: #C4D7EE;
    --apfs-home-shadow:
        0 20px 50px rgba(15, 39, 68, 0.085);
    --apfs-home-card-shadow:
        0 10px 28px rgba(15, 39, 68, 0.06);
}

/* --------------------------------------------------------------------------
   CANONICAL APFS HERO
   -------------------------------------------------------------------------- */

#hero.apfs-home-foundation {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 88% 12%,
            rgba(37, 99, 235, 0.13) 0,
            rgba(37, 99, 235, 0.055) 20%,
            transparent 36%
        ),
        radial-gradient(
            circle at 8% 82%,
            rgba(15, 39, 68, 0.055) 0,
            transparent 31%
        ),
        linear-gradient(
            135deg,
            #E8F0F8 0%,
            #EDF3F9 45%,
            #E3ECF6 100%
        ) !important;
}

#hero.apfs-home-foundation::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 430px;
    height: 430px;
    right: -165px;
    top: -175px;
    border-radius: 50%;
    background: rgba(37, 99, 235, 0.055);
    pointer-events: none;
}

#hero.apfs-home-foundation::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 310px;
    height: 310px;
    left: -185px;
    bottom: -185px;
    border-radius: 50%;
    background: rgba(15, 39, 68, 0.035);
    pointer-events: none;
}

#hero .apfs-home-hero {
    position: relative;
    background: transparent !important;
}

#hero .apfs-home-title,
#hero .apfs-home-section-title,
#hero .apfs-home-panel-title,
#hero .apfs-home-operating-card strong {
    color: var(--apfs-home-heading);
}

#hero .apfs-home-title {
    letter-spacing: -0.045em;
}

#hero .apfs-home-lead,
#hero .apfs-home-search-note,
#hero .apfs-home-section-copy,
#hero .apfs-home-operating-card span {
    color: var(--apfs-home-body);
}

/* --------------------------------------------------------------------------
   CANONICAL HERO SEARCH
   -------------------------------------------------------------------------- */

#hero .apfs-home-search {
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid var(--apfs-home-border);
    box-shadow:
        0 8px 22px rgba(15, 39, 68, 0.055);
    backdrop-filter: blur(8px);
}

#hero .apfs-home-search:focus-within {
    border-color: rgba(37, 99, 235, 0.45);
    box-shadow:
        0 0 0 4px rgba(37, 99, 235, 0.075),
        0 10px 28px rgba(15, 39, 68, 0.065);
}

#hero .apfs-home-search input {
    color: var(--apfs-home-heading);
}

#hero .apfs-home-search input::placeholder {
    color: #64748B;
}

#hero .apfs-home-search-button,
#hero .apfs-home-action-primary {
    background: var(--apfs-home-primary);
    border-color: var(--apfs-home-primary);
    color: #FFFFFF;
    box-shadow: none;
}

#hero .apfs-home-search-button:hover,
#hero .apfs-home-action-primary:hover {
    background: var(--apfs-home-primary-hover);
    border-color: var(--apfs-home-primary-hover);
}

/* --------------------------------------------------------------------------
   CONNECTED PLATFORM PANEL
   -------------------------------------------------------------------------- */

#hero .apfs-home-hero-panel {
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(212, 224, 236, 0.98);
    box-shadow: var(--apfs-home-shadow);
    backdrop-filter: blur(10px);
}

#hero .apfs-home-operating-card {
    background: var(--apfs-home-card-soft);
    border: 1px solid var(--apfs-home-border);
    box-shadow: none;
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        background-color 160ms ease,
        box-shadow 160ms ease;
}

#hero .apfs-home-operating-card:hover {
    transform: translateY(-2px);
    background: var(--apfs-home-card);
    border-color: var(--apfs-home-border-blue);
    box-shadow: var(--apfs-home-card-shadow);
}

/* --------------------------------------------------------------------------
   ECOSYSTEM
   -------------------------------------------------------------------------- */

#hero .apfs-home-ecosystem {
    background:
        linear-gradient(
            180deg,
            #E6EEF7 0%,
            #EAF0F7 100%
        ) !important;
    border-top: 1px solid rgba(212, 224, 236, 0.9);
}

#hero .apfs-home-ecosystem-card {
    background: #FFFFFF;
    border: 1px solid var(--apfs-home-border);
    box-shadow: var(--apfs-home-card-shadow);
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

#hero .apfs-home-ecosystem-card:hover {
    transform: translateY(-3px);
    border-color: var(--apfs-home-border-blue);
    box-shadow:
        0 14px 34px rgba(15, 39, 68, 0.08);
}

#hero .apfs-home-ecosystem-card h3 {
    color: var(--apfs-home-heading);
}

#hero .apfs-home-ecosystem-card p {
    color: var(--apfs-home-body);
}

/* --------------------------------------------------------------------------
   SERVICES
   Existing content and anchor preserved.
   -------------------------------------------------------------------------- */

#services {
    background:
        linear-gradient(
            180deg,
            #EDF3F9 0%,
            #F2F6FA 100%
        ) !important;
}

#services h1,
#services h2,
#services h3,
#services h4 {
    color: var(--apfs-home-heading);
}

#services p {
    color: var(--apfs-home-body);
}

#services article,
#services .service-card,
#services [class*="service-card"],
#services [class*="category-card"] {
    background: #FFFFFF;
    border-color: var(--apfs-home-border);
    box-shadow: var(--apfs-home-card-shadow);
}

/* --------------------------------------------------------------------------
   POPULAR SERVICES / MARKETPLACE
   -------------------------------------------------------------------------- */

#popular-services {
    background:
        linear-gradient(
            180deg,
            #E6EEF7 0%,
            #EDF3F9 100%
        ) !important;
}

#popular-services h1,
#popular-services h2,
#popular-services h3,
#popular-services h4 {
    color: var(--apfs-home-heading);
}

#popular-services p {
    color: var(--apfs-home-body);
}

#popular-services article,
#popular-services .adowla-service-card,
#popular-services [class*="service-card"] {
    background: #FFFFFF;
    border-color: var(--apfs-home-border);
    box-shadow: var(--apfs-home-card-shadow);
}

/* --------------------------------------------------------------------------
   P2 MARKETPLACE DESTINATIONS
   No anchor / implementation changes.
   -------------------------------------------------------------------------- */

#production,
#talent,
#studios,
#advertising,
#creators,
#live-commerce,
#locations,
#marketing {
    border-color: var(--apfs-home-border);
}

#production h1,
#production h2,
#production h3,
#talent h1,
#talent h2,
#talent h3,
#studios h1,
#studios h2,
#studios h3,
#advertising h1,
#advertising h2,
#advertising h3,
#creators h1,
#creators h2,
#creators h3,
#live-commerce h1,
#live-commerce h2,
#live-commerce h3,
#locations h1,
#locations h2,
#locations h3,
#marketing h1,
#marketing h2,
#marketing h3 {
    color: var(--apfs-home-heading);
}

/* --------------------------------------------------------------------------
   ACCESSIBILITY / RESPONSIVE
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    #hero .apfs-home-operating-card,
    #hero .apfs-home-ecosystem-card {
        transition: none;
    }
}

@media (max-width: 900px) {
    #hero.apfs-home-foundation::before {
        width: 320px;
        height: 320px;
        right: -165px;
        top: -145px;
    }

    #hero .apfs-home-hero-panel {
        box-shadow:
            0 14px 36px rgba(15, 39, 68, 0.07);
    }
}

@media (max-width: 720px) {
    #hero.apfs-home-foundation {
        background:
            radial-gradient(
                circle at 92% 3%,
                rgba(37, 99, 235, 0.11),
                transparent 30%
            ),
            linear-gradient(
                180deg,
                #E8F0F8 0%,
                #EDF3F9 100%
            ) !important;
    }

    #hero.apfs-home-foundation::before,
    #hero.apfs-home-foundation::after {
        opacity: 0.5;
    }

    #hero .apfs-home-operating-card:hover,
    #hero .apfs-home-ecosystem-card:hover {
        transform: none;
    }
}

/* ==========================================================================
   P3-A2-A1-R2 BOUNDARY

   Deferred:
   A2 How It Works
   A3 Why Adowla / Benefits
   A4 Earn / Provider
   A5 Pricing / Testimonials
   A6 FAQ / Contact / Final CTA
   ========================================================================== */
