/* =========================================================
   ACRT 2027 — SPONSORSHIP SECTION
   ========================================================= */

:root {
  /* NexCGT screenshot-matched blue palette */
  --base-deep: #071B5C;
  --base-mid: #0A205F;
  --base-soft: #173674;

  --primary: #0B2F8A;
  --primary-dark: #06205F;
  --primary-light: #2E63C7;
  --primary-soft: #7195D6;

  --slate-warm: #FFFFFF;
  --slate-light: #FFFFFF;
  --graphite: #1D3D78;
  --graphite-soft: #31528F;

  --ivory: #F7F9FF;
  --ivory-muted: #FFFFFF;
  --silver: #FFFFFF;

  --panel-bg: rgba(7, 27, 92, .62);
  --panel-border: rgba(160, 190, 255, .14);

  --accent: #2E63C7;
  --accent-hover: #4C82EA;
  --accent-light: #FFFFFF;

  --blue-glow: rgba(66, 126, 230, .32);
  --silk-ease: cubic-bezier(.16, 1, .3, 1);

  /* Compatibility aliases */
  --ink: var(--base-mid);
  --ink-soft: #31528F;
  --void: var(--base-deep);
  --void-soft: var(--base-mid);
  --void-alt: var(--base-soft);

  --paper: var(--ivory);
  --paper-raised: #FFFFFF;
  --parchment: var(--ivory);

  --terracotta: var(--primary-light);
  --terracotta-deep: var(--primary-dark);
  --bronze: var(--primary-soft);
  --bronze-light: #9DB8EA;

  --violet: var(--primary-soft);
  --violet-dim: #4D78C5;
  --cyan: #65A7FF;
  --coral: var(--accent-hover);
  --charcoal: var(--graphite);

  --gold: var(--primary-light);
  --gold-dim: var(--primary-soft);
  --teal: #4D8FE8;
  --teal-deep: var(--primary-light);
  --teal-tint: rgba(46, 99, 199, .10);
  --eosin: #4C82EA;

  --line: rgba(29, 61, 120, .16);
  --line-light: rgba(29, 61, 120, .10);
  --line-dark: rgba(160, 190, 255, .18);
  --line-strong: rgba(29, 61, 120, .26);

  --shadow: 0 10px 34px rgba(7, 27, 92, .20);
}



.sponsorship-section {
    padding: 76px 0 90px;
}


/* ---------- Header ---------- */

.sponsorship-header {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 70px;

    align-items: end;

    margin-bottom: 42px;
}

.sponsorship-header .section-label {
    color: var(--gold);
    margin-bottom: 13px;
}

.sponsorship-header h2 {
    font-family: 'Fraunces', 'Source Serif 4', serif;
    font-size: clamp(2.3rem, 4.2vw, 4rem);
    line-height: 1;
    font-weight: 500;
    letter-spacing: -.02em;
    margin: 0;
}

.sponsorship-header h2 em {
    color: var(--teal-deep);
    font-style: italic;
}

.sponsorship-header > p {
    max-width: 55ch;
    color: var(--ink-soft);
    font-size: 1rem;
    line-height: 1.7;
    margin: 0;
}


/* ---------- Main Layout ---------- */

.sponsorship-layout {
    display: grid;
    grid-template-columns: 1.02fr .98fr;
    gap: 28px;
    align-items: stretch;
}


/* =========================================================
   FORM PANEL
   ========================================================= */

.sponsor-form-panel {
    position: relative;
    background: var(--paper-raised);
    border: 1px solid var(--line-strong);
    border-top: 3px solid var(--bronze);
    padding: 36px 32px 34px;
}

.sponsor-form-top {
    margin-bottom: 30px;
}

.sponsor-kicker,
.sponsor-info-kicker,
.template-label {
    display: block;

    font-family: 'IBM Plex Mono', monospace;
    font-size: .65rem;
    font-weight: 600;

    letter-spacing: .12em;
    text-transform: uppercase;

    color: var(--gold);

    margin-bottom: 9px;
}

.sponsor-form-top h3 {
    font-family: 'Fraunces', 'Source Serif 4', serif;

    font-size: clamp(1.8rem, 3vw, 2.45rem);
    line-height: 1.08;

    font-weight: 500;

    margin: 0 0 8px;
}

.sponsor-form-top p {
    color: var(--ink-soft);
    font-size: .92rem;
    margin: 0;
}


/* ---------- Fields ---------- */

.sponsor-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.sponsor-field label {
    display: block;

    font-family: 'IBM Plex Mono', monospace;
    font-size: .68rem;
    font-weight: 600;

    letter-spacing: .07em;
    text-transform: uppercase;

    color: var(--ink);

    margin-bottom: 7px;
}

.sponsor-field label span {
    color: red;
}
.spo-info {
    font-size: 22px !important;
}

.sponsor-guide {
    font-size: 22px !important;
}

.sponsor-field input,
.sponsor-field textarea {
    width: 100%;

    border: 1px solid var(--line-strong);

    border-radius: 0;

    background: #fff;

    color: var(--ink);

    font-family: 'Source Serif 4', Georgia, serif;
    font-size: .98rem;

    padding: 12px 13px;

    outline: none;

    transition:
        border-color .2s ease,
        background .2s ease;
}

.sponsor-field input {
    height: 46px;
}

.sponsor-field textarea {
    min-height: 128px;
    resize: vertical;
}

.sponsor-field input::placeholder,
.sponsor-field textarea::placeholder {
    color: #7182A5;
}

.sponsor-field input:focus,
.sponsor-field textarea:focus {
    border-color: var(--teal);
    background: var(--teal-tint);
}


/* ---------- Submit ---------- */

.sponsor-form-actions {
    padding-top: 3px;
}

.sponsor-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;

    border: 1px solid var(--eosin);

    background: var(--bronze);
    color: #fff;

    font-family: 'IBM Plex Mono', monospace;
    font-size: .7rem;
    font-weight: 600;

    letter-spacing: .07em;
    text-transform: uppercase;

    padding: 13px 20px;

    min-width: 170px;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.sponsor-submit svg,
.sponsor-template-btn svg {
    width: 17px;
    height: 17px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;

    transition: transform .2s ease;
}

.sponsor-submit:hover {
    background: var(--bronze-light);
    border-color: var(--bronze);
}

.sponsor-submit:hover svg {
    transform: translateX(4px);
}


/* =========================================================
   INFORMATION PANEL
   ========================================================= */

.sponsor-info-panel {
    background: var(--ink);
    color: #fff;

    border: 1px solid var(--ink);

    padding: 10px;
}

.sponsor-info-inner {
    /* height: 100%; */

    border: 1px solid rgba(113, 149, 214, .22);

    padding: 30px 32px 28px;

    display: flex;
    flex-direction: column;
}

.sponsor-info-kicker {
    color: var(--bronze-light);
}

.sponsor-info-panel h3 {
    color: #fff;

    font-family: 'Fraunces', 'Source Serif 4', serif;

    font-size: clamp(1.1rem, 3vw, 1.1rem);
    line-height: 1.06;

    font-weight: 500;

    margin: 0 0 20px;

    /* max-width: 15ch; */
}

.sponsor-info-panel h3 em {
    color: var(--bronze-light);
    font-style: italic;
}

.sponsor-info-intro {
    color: #fff;

    font-family: 'Space Grotesk', sans-serif;

    font-size: .9rem;
    line-height: 1.7;

    max-width: 58ch;

    margin: 0 0 24px;
}


/* =========================================================
   BENEFITS
   ========================================================= */

.sponsor-benefits {
    border-top: 1px solid rgba(160, 190, 255, .17);
}

.sponsor-benefit {
    display: grid;
    grid-template-columns: 38px 1fr;

    gap: 14px;

    padding: 17px 0;

    border-bottom: 1px solid rgba(160, 190, 255, .14);
}

.benefit-number {
    font-family: 'IBM Plex Mono', monospace;

    font-size: .65rem;
    font-weight: 600;

    color: var(--bronze-light);

    padding-top: 3px;
}

.sponsor-benefit h4 {
    color: #fff;

    font-family: 'Fraunces', 'Source Serif 4', serif;

    font-size: 1.1rem;
    font-weight: 500;

    margin: 0 0 4px;
}

.sponsor-benefit p {
    color: #fff;

    font-size: .78rem;
    line-height: 1.55;

    margin: 0;
}


/* =========================================================
   SPONSORSHIP TEMPLATE CTA
   ========================================================= */

.sponsor-template {
    margin-top: auto;
    padding-top: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    margin-bottom: 10px;
}

.template-label {
    color: #9DB8EA;
    margin-bottom: 5px;
}

.sponsor-template p {
    color: #B8C8E5;

    font-size: .78rem;
    line-height: 1.5;

    margin: 0;

    max-width: 35ch;
}


/* ---------- Template Button ---------- */

.sponsor-template-btn {
    flex-shrink: 0;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: 44px;

    padding: 11px 15px;

    border: 1px solid rgba(255, 255, 255, .38);

    color: #fff;

    font-family: 'IBM Plex Mono', monospace;

    font-size: .67rem;
    font-weight: 600;

    letter-spacing: .05em;

    text-transform: uppercase;

    text-decoration: none;
background: var(--bronze);
    transition:
        background .2s ease,
        border-color .2s ease;
}

.sponsor-template-btn:hover {
    background: var(--eosin);
    border-color: var(--eosin);
}

.sponsor-template-btn:hover svg {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .sponsorship-header {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .sponsorship-layout {
        grid-template-columns: 1fr;
    }

    .sponsor-info-panel {
        min-height: auto;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .sponsorship-section {
        padding: 55px 0 65px;
    }

    .sponsorship-header {
        margin-bottom: 28px;
    }

    .sponsorship-header h2 {
        font-size: 2.35rem;
    }

    .sponsor-form-panel {
        padding: 28px 20px;
    }

    .sponsor-info-panel {
        padding: 7px;
    }

    .sponsor-info-inner {
        padding: 26px 20px;
    }

    .sponsor-info-panel h3 {
        font-size: 2rem;
    }

    .sponsor-template {
        flex-direction: column;
        align-items: flex-start;
    }

    .sponsor-template-btn {
        width: 100%;
    }

}
/* =========================================================
   SPONSORSHIP SUCCESS POPUP
========================================================= */

.sponsorship-success-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 20px;

    background: rgba(7, 27, 92, 0.72);

    opacity: 0;
    visibility: hidden;

    transition:
        opacity 0.3s ease,
        visibility 0.3s ease;
}


.sponsorship-success-overlay.show {
    opacity: 1;
    visibility: visible;
}


.sponsorship-success-popup {
    width: min(500px, 100%);

    padding: 45px 35px;

    text-align: center;

    background: #ffffff;

    border-radius: 20px;

    box-shadow:
        0 25px 80px rgba(7, 27, 92, 0.20);

    transform: translateY(20px) scale(0.96);

    transition:
        transform 0.3s ease;
}


.sponsorship-success-overlay.show
.sponsorship-success-popup {

    transform:
        translateY(0)
        scale(1);

}


.sponsorship-success-popup
.success-icon {

    width: 70px;
    height: 70px;

    margin: 0 auto 20px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    font-size: 28px;

}


.sponsorship-success-popup h3 {

    margin-bottom: 12px;

}


.sponsorship-success-popup p {

    margin-bottom: 25px;

    line-height: 1.7;

}


.sponsorship-success-popup
.success-close-btn {

    border: 0;

    padding: 12px 25px;

    border-radius: 8px;

    cursor: pointer;

    font-weight: 600;

}


/* ============================================================
   NEXCGT SPONSORSHIP BLUE THEME
   ============================================================ */

.sponsorship-header .section-label,
.sponsor-kicker,
.sponsor-info-kicker,
.template-label {
    color: #2E63C7;
}

.sponsorship-header h2 em {
    color: #4D8FE8;
}

.sponsor-form-panel {
    border-color: #C5D3EC;
    border-top-color: #7195D6;
    background: #FFFFFF;
}

.sponsor-field input,
.sponsor-field textarea {
    border-color: #C5D3EC;
    background: #FFFFFF;
}

.sponsor-field input:focus,
.sponsor-field textarea:focus {
    border-color: #2E63C7;
    background: #F3F7FE;
    box-shadow: 0 0 0 3px rgba(46,99,199,.08);
}

.sponsor-submit {
    border-color: #2E63C7;
    background: #2E63C7;
    color: #FFFFFF;
}

.sponsor-submit:hover {
    background: #4C82EA;
    border-color: #4C82EA;
}

.sponsor-info-panel {
    background:
        radial-gradient(circle at 85% 15%, rgba(76,130,234,.18), transparent 38%),
        linear-gradient(145deg, #071B5C 0%, #0A205F 55%, #173674 100%);
    border-color: #0A205F;
}

.sponsor-info-inner {
    border-color: rgba(160,190,255,.22);
}

.sponsor-info-kicker,
.sponsor-info-panel h3 em,
.benefit-number {
    color: #9DB8EA;
}

.sponsor-benefits {
    border-top-color: rgba(160,190,255,.18);
}

.sponsor-benefit {
    border-bottom-color: rgba(160,190,255,.14);
}

.sponsor-template-btn {
    background: #2E63C7;
    border-color: #2E63C7;
    color: #FFFFFF;
}

.sponsor-template-btn:hover {
    background: #4C82EA;
    border-color: #4C82EA;
}

.sponsor-template p {
    color: #B8C8E5;
}

.sponsorship-success-popup {
    background: #FFFFFF;
    border: 1px solid #C5D3EC;
    box-shadow: 0 25px 80px rgba(7,27,92,.20);
}

.sponsorship-success-popup .success-icon {
    background: #E4ECFB;
    color: #2E63C7;
    border: 1px solid #B9CCEC;
}

.sponsorship-success-popup .success-close-btn {
    background: #2E63C7;
    color: #FFFFFF;
}

.sponsorship-success-popup .success-close-btn:hover {
    background: #4C82EA;
}