/* =====================================================================
   site.css — additions made when this Wayback capture was rebuilt.
   The other seven stylesheets are the site's own template files, changed
   only to strip archive URLs and to neutralise the twelve background
   images the capture never downloaded.

   This file supplies what those lost images used to carry — chiefly the
   hero, whose banner artwork (images/banner/Web-banner5.jpg) held the
   entire title lock-up, and whose content block in the markup was empty.
   ===================================================================== */

:root {
    --gt-ink: #241640;
    --gt-ink-2: #3a2470;
    --gt-accent: #7c3aed;
    --gt-accent-2: #f59e0b;
    --gt-cyan: #22d3ee;
}

.skip-link {
    position: absolute; left: -9999px; top: 0; z-index: 3000;
    padding: 12px 22px; background: var(--gt-accent); color: #fff;
    font-weight: 700; border-radius: 0 0 6px 0;
}
.skip-link:focus { left: 0; }

img { max-width: 100%; height: auto; }

/* --------------------------------------------------------- header -- */
.header-transparent { background: rgba(36, 22, 64, .88); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.navbar-brand img { height: 54px; width: auto; }

.navbar-dark .navbar-nav .nav-link { color: #e6ddff; font-weight: 600; }
.navbar-dark .navbar-nav .nav-link:hover { color: #fff; }

.nav-cta {
    background: linear-gradient(135deg, var(--gt-accent), #4c1d95);
    color: #fff !important; border-radius: 999px;
    padding: 8px 20px !important; margin-left: 10px;
    box-shadow: 0 8px 20px rgba(124, 58, 237, .35);
}
.nav-cta:hover { background: linear-gradient(135deg, #8b5cf6, var(--gt-accent)); }

.dropdown-menu { border: 0; border-radius: 10px; box-shadow: 0 18px 44px rgba(36, 22, 64, .22); padding: 8px; }
.dropdown-item { border-radius: 7px; font-size: 14.5px; font-weight: 600; white-space: normal; }

/* ----------------------------------------------------------- hero -- */
/* the banner JPG is gone, so the section paints its own backdrop */
.home-section { padding: 0; }

.banner-item {
    position: relative;
    display: flex; align-items: center;
    min-height: 640px;
    padding: 150px 0 110px;
    background:
        radial-gradient(1000px 520px at 12% 8%, rgba(124, 58, 237, .55), transparent 62%),
        radial-gradient(900px 560px at 88% 90%, rgba(34, 211, 238, .28), transparent 60%),
        linear-gradient(140deg, #1a0f33 0%, #241640 48%, #3a2470 100%);
    overflow: hidden;
}

.banner-shade {
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 58px 58px;
    -webkit-mask-image: radial-gradient(120% 90% at 50% 0%, #000 30%, transparent 76%);
    mask-image: radial-gradient(120% 90% at 50% 0%, #000 30%, transparent 76%);
}

.banner-item .container { position: relative; z-index: 2; }

.banner-eyebrow {
    display: inline-block; margin-bottom: 22px;
    padding: 8px 18px; border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .28);
    background: rgba(255, 255, 255, .08);
    color: #fff; font-size: 13px; font-weight: 700;
    letter-spacing: .12em; text-transform: uppercase;
}

.banner-content-wrap h1 {
    color: #fff; margin: 0 0 18px;
    font-family: "Raleway", sans-serif;
    font-size: clamp(36px, 5.4vw, 72px);
    font-weight: 900; line-height: 1.05; letter-spacing: -0.02em;
}

.banner-theme {
    margin: 0 auto 30px; max-width: 40ch;
    font-size: clamp(17px, 2vw, 25px); font-weight: 600; line-height: 1.4;
    background: linear-gradient(100deg, #c4b5fd, var(--gt-accent-2));
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
}

.banner-facts {
    list-style: none; margin: 0 0 34px; padding: 0;
    display: flex; flex-wrap: wrap; justify-content: center; gap: 12px;
}
.banner-facts li {
    display: inline-flex; align-items: center; gap: 9px;
    padding: 9px 18px; border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .18);
    background: rgba(255, 255, 255, .07);
    color: #fff; font-size: 15px; font-weight: 500;
}
.banner-facts i { color: var(--gt-accent-2); }

.banner-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }

.btn-summit, .btn-summit-ghost {
    display: inline-flex; align-items: center; gap: 9px;
    padding: 14px 30px; border-radius: 999px;
    font-weight: 700; font-size: 15.5px; border: 0;
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
}
.btn-summit {
    background: linear-gradient(135deg, var(--gt-accent), #4c1d95); color: #fff;
    box-shadow: 0 12px 30px rgba(124, 58, 237, .45);
}
.btn-summit:hover { transform: translateY(-2px); color: #fff; box-shadow: 0 18px 40px rgba(124, 58, 237, .55); }

.btn-summit-ghost { border: 2px solid rgba(255, 255, 255, .55); color: #fff; background: transparent; }
.btn-summit-ghost:hover { background: #fff; border-color: #fff; color: var(--gt-ink); }

/* ---------------------------------------------------------- about -- */
/* section-bg image lost; the gradient replaces it */
.ts-event-outcome {
    padding: clamp(60px, 7vw, 96px) 0;
    background: linear-gradient(135deg, var(--gt-ink) 0%, var(--gt-ink-2) 100%);
}
.ts-event-outcome .section-title { margin-bottom: 26px; }
.ts-event-outcome p { font-size: 17px; line-height: 1.8; margin-bottom: 18px; }
.about-cta { margin-top: 28px; margin-bottom: 0; }

/* --------------------------------------------------------- titles -- */
/* .section-title relied on images/shap/title*.png for its underline */
.section-title {
    position: relative;
    font-family: "Raleway", sans-serif;
    font-weight: 800;
    font-size: clamp(28px, 3.4vw, 44px);
    letter-spacing: -0.02em;
    padding-bottom: 20px;
    margin-bottom: 40px;
}
.section-title::after {
    content: ""; position: absolute; bottom: 0; left: 0;
    width: 88px; height: 5px; border-radius: 999px;
    background: linear-gradient(90deg, var(--gt-accent), var(--gt-accent-2));
}
.section-title.text-center::after { left: 50%; transform: translateX(-50%); }
.section-title.text-white::after { background: linear-gradient(90deg, #fff, var(--gt-accent-2)); }

/* --------------------------------------------------------- topics -- */
.ts-intro-item { padding: clamp(60px, 7vw, 96px) 0; background: #f7f5fd; }

.single-intro-text {
    height: 100%; padding: 32px 28px;
    background: #fff; border: 1px solid #e9e4f7; border-radius: 16px;
    box-shadow: 0 4px 16px rgba(36, 22, 64, .06);
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.single-intro-text:hover {
    transform: translateY(-6px);
    border-color: rgba(124, 58, 237, .45);
    box-shadow: 0 18px 44px rgba(36, 22, 64, .14);
}
.single-intro-text i {
    display: grid; place-items: center;
    width: 62px; height: 62px; margin-bottom: 20px;
    border-radius: 16px; font-size: 26px; color: var(--gt-accent);
    background: linear-gradient(135deg, rgba(124, 58, 237, .14), rgba(245, 158, 11, .14));
}
.single-intro-text .ts-title {
    margin: 0; font-size: 18.5px; line-height: 1.45; font-weight: 700; color: var(--gt-ink);
}

/* ----------------------------------------------- who should attend -- */
.ts-schedule { position: relative; padding: clamp(60px, 7vw, 96px) 0; overflow: hidden; }
.attend-grid { row-gap: 24px; }

.attend-card {
    height: 100%; padding: 30px 24px; text-align: center;
    background: #fff; border: 1px solid #e9e4f7; border-radius: 16px;
    box-shadow: 0 4px 16px rgba(36, 22, 64, .06);
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.attend-card:hover {
    transform: translateY(-6px);
    border-color: rgba(124, 58, 237, .45);
    box-shadow: 0 18px 44px rgba(36, 22, 64, .14);
}
.attend-card i {
    display: grid; place-items: center;
    width: 60px; height: 60px; margin: 0 auto 18px;
    border-radius: 50%; font-size: 24px; color: #fff;
    background: linear-gradient(135deg, var(--gt-accent), #4c1d95);
    box-shadow: 0 10px 24px rgba(124, 58, 237, .32);
}
.attend-card h3 { margin: 0; font-size: 18px; font-weight: 700; color: var(--gt-ink); }

.speaker-shap { position: absolute; inset: 0; pointer-events: none; z-index: -1; }
.speaker-shap .shap1 { position: absolute; right: 3%; bottom: 8%; opacity: .5; }
.speaker-shap .shap2 { position: absolute; left: 3%; top: 12%; opacity: .5; }

/* -------------------------------------------------------- contact -- */
/* book_seat_img.jpg was lost with the rest */
.ts-book-seat {
    padding: clamp(60px, 7vw, 96px) 0;
    background:
        radial-gradient(700px 400px at 20% 10%, rgba(124, 58, 237, .45), transparent 60%),
        linear-gradient(135deg, #1a0f33, #3a2470);
}
.contact-name { color: #fff; font-size: 26px; font-weight: 800; margin-bottom: 18px; }
.contact-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.contact-list li { color: #fff; font-size: 19px; }
.contact-list i { color: var(--gt-accent-2); margin-right: 10px; }
.contact-list a { color: #fff; font-weight: 600; }
.contact-list a:hover { color: var(--gt-accent-2); text-decoration: underline; }

/* --------------------------------------------------------- footer -- */
.ts-footer { background: #150c29; padding: 44px 0 30px; }
.ts-footer-social ul { list-style: none; margin: 0 0 22px; padding: 0; display: flex; gap: 12px; justify-content: center; }
.ts-footer-social a {
    display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
    background: rgba(255, 255, 255, .08); color: #d9cff5; font-size: 17px;
    transition: background .3s ease, color .3s ease, transform .3s ease;
}
.ts-footer-social a:hover { background: var(--gt-accent); color: #fff; transform: translateY(-3px); }

.footer-menu ul { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 26px; justify-content: center; }
.footer-menu a { color: #bdb0dd; font-weight: 600; font-size: 15px; }
.footer-menu a:hover { color: #fff; }

.ts-footer .copyright { color: #8f82b3; font-size: 14px; margin: 0; }

/* ---------------------------------------------------- back to top -- */
.back-to-top {
    position: fixed; right: 26px; bottom: 26px; z-index: 900;
    display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%;
    background: linear-gradient(135deg, var(--gt-accent), #4c1d95); color: #fff;
    box-shadow: 0 10px 26px rgba(124, 58, 237, .45);
    opacity: 0; visibility: hidden; transform: translateY(10px); transition: .3s ease;
}
.back-to-top.show { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top:hover { color: #fff; transform: translateY(-3px); }

/* in-page anchors must clear the fixed header */
section[id], div[id="contact"] { scroll-margin-top: 96px; }
html { scroll-behavior: smooth; }

@media (max-width: 991px) {
    .banner-item { min-height: 520px; padding: 130px 0 80px; }
    .nav-cta { display: inline-block; margin: 10px 0 0; }
    .speaker-shap { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* =====================================================================
   Overrides for the template's own rules
   ===================================================================== */

/* .banner-content-wrap ships with `padding: 300px 0 212px`, which left the
   hero over 1,100px tall with a dead half. */
.banner-item .banner-content-wrap {
    padding: 0 !important;
    z-index: 2;
}

.banner-item { min-height: 620px; padding: 130px 0 96px; }

/* the template centres .section-title:after with left:0/right:0/margin:auto;
   mixing that with left:50% left the rule hanging off to one side */
.section-title::after,
.column-title::after {
    left: 0 !important;
    right: 0 !important;
    margin: 0 auto !important;
    transform: none !important;
    width: 88px;
    height: 5px;
    border-radius: 999px;
    background-image: none;
    background: linear-gradient(90deg, var(--gt-accent), var(--gt-accent-2));
}
.section-title.text-white::after { background: linear-gradient(90deg, #fff, var(--gt-accent-2)); }

.section-title, .column-title {
    margin-bottom: 48px;
    padding-bottom: 22px;
    color: var(--gt-ink);
}
.section-title.text-white { color: #fff; }

/* nav pill: menu links carry their own padding, which stretched it to an oval */
.navbar-dark .navbar-nav .nav-item .nav-link.nav-cta {
    display: inline-block;
    padding: 10px 22px !important;
    margin: 0 0 0 12px;
    line-height: 1.2;
    border-radius: 999px;
    white-space: nowrap;
}
.navbar-nav .nav-item:has(> .nav-cta) { display: flex; align-items: center; }

/* the logo PNG has a white ground — give it a deliberate plate */
.navbar-brand img {
    background: #fff;
    padding: 8px 12px;
    border-radius: 10px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
}

/* =====================================================================
   TOPICS OF DISCUSSION — numbered cards with a gradient edge
   ===================================================================== */
.ts-intro-item {
    position: relative;
    background:
        radial-gradient(680px 340px at 8% 0%, rgba(124, 58, 237, .09), transparent 60%),
        radial-gradient(620px 340px at 92% 100%, rgba(245, 158, 11, .10), transparent 60%),
        #f7f5fd;
}
.ts-intro-item .row + .row { margin-top: 6px; }
.ts-intro-item .col-lg-6 { display: flex; }

.single-intro-text {
    position: relative;
    width: 100%;
    padding: 34px 32px 32px !important;
    overflow: hidden;
    border: 1px solid #e9e4f7;
    border-radius: 18px !important;
    background: #fff;
    box-shadow: 0 6px 20px rgba(36, 22, 64, .06) !important;
    transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease;
}

/* accent edge that wipes in on hover */
.single-intro-text::before {
    content: "";
    position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
    background: linear-gradient(180deg, var(--gt-accent), var(--gt-accent-2));
    transform: scaleY(0); transform-origin: top;
    transition: transform .4s cubic-bezier(.2,.8,.2,1);
}
.single-intro-text:hover::before { transform: scaleY(1); }

.single-intro-text:hover {
    transform: translateY(-7px);
    border-color: rgba(124, 58, 237, .38);
    box-shadow: 0 24px 54px rgba(36, 22, 64, .16) !important;
}

/* oversized ghost number in the corner */
.topic-num {
    position: absolute;
    right: 18px; bottom: -14px;
    font-family: "Raleway", sans-serif;
    font-size: 96px; font-weight: 900; line-height: 1;
    letter-spacing: -0.04em;
    color: transparent;
    -webkit-text-stroke: 2px rgba(124, 58, 237, .16);
    pointer-events: none;
    transition: -webkit-text-stroke-color .35s ease, transform .35s ease;
}
.single-intro-text:hover .topic-num {
    -webkit-text-stroke-color: rgba(245, 158, 11, .38);
    transform: translateY(-4px);
}

/* icon tile — the template floats a grey glyph off the right edge */
.single-intro-text i {
    position: static !important;
    display: grid; place-items: center;
    width: 60px; height: 60px; margin-bottom: 22px;
    border-radius: 16px;
    font-size: 25px !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--gt-accent), #4c1d95);
    box-shadow: 0 10px 24px rgba(124, 58, 237, .30);
    transition: transform .35s ease, box-shadow .35s ease;
}
.single-intro-text:hover i {
    transform: translateY(-3px) rotate(-4deg);
    box-shadow: 0 16px 32px rgba(124, 58, 237, .42);
}

.single-intro-text .ts-title {
    position: relative; z-index: 1;
    margin: 0 !important;
    font-size: 19px; font-weight: 700; line-height: 1.45;
    color: var(--gt-ink);
    max-width: 30ch;
}

@media (max-width: 991px) {
    .banner-item { min-height: 500px; padding: 120px 0 72px; }
    .ts-intro-item .col-lg-6 { display: block; }
    .single-intro-text { margin-bottom: 24px; }
}

/* =====================================================================
   Navigation contrast
   The menu links computed to solid black over the dark purple header, so
   they were effectively invisible. Forced to a light tint, with the
   dropdown left dark-on-white since that panel is light.
   ===================================================================== */
.header .navbar .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-item .nav-link {
    color: #ece5ff !important;
    font-weight: 600;
    letter-spacing: .01em;
}

.header .navbar .navbar-nav .nav-link:hover,
.header .navbar .navbar-nav .nav-link:focus,
.header .navbar .navbar-nav .show > .nav-link {
    color: #ffffff !important;
}

/* keep the pill readable and above the generic rule */
.header .navbar .navbar-nav .nav-link.nav-cta,
.navbar-dark .navbar-nav .nav-item .nav-link.nav-cta { color: #fff !important; }

/* underline on hover so the active item is obvious */
.header .navbar .navbar-nav .nav-item > .nav-link:not(.nav-cta) { position: relative; }
.header .navbar .navbar-nav .nav-item > .nav-link:not(.nav-cta)::after {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px;
    height: 2px; border-radius: 2px;
    background: linear-gradient(90deg, var(--gt-accent-2), #fff);
    transform: scaleX(0); transform-origin: left;
    transition: transform .3s ease;
}
.header .navbar .navbar-nav .nav-item > .nav-link:not(.nav-cta):hover::after { transform: scaleX(1); }

/* dropdown panel is white — keep its items dark */
.dropdown-menu .dropdown-item { color: var(--gt-ink) !important; }
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus { background: #f3efff !important; color: #4c1d95 !important; }

/* burger + its icon on mobile */
.navbar-dark .navbar-toggler {
    border-color: rgba(255, 255, 255, .35);
    color: #fff;
}
.navbar-dark .navbar-toggler .navbar-toggler-icon { background-image: none; width: auto; height: auto; }
.navbar-dark .navbar-toggler i { color: #fff; font-size: 20px; }

/* collapsed menu sits on the dark header, so keep the panel dark too */
@media (max-width: 991px) {
    #mainNav {
        background: rgba(26, 15, 51, .97);
        border-radius: 12px;
        margin-top: 10px;
        padding: 10px 14px;
    }
    .header .navbar .navbar-nav .nav-item > .nav-link:not(.nav-cta)::after { display: none; }
}

/* =====================================================================
   Sticky header
   main.js adds `.sticky` to .header past 250px of scroll, and the template
   makes that state solid white — so the light menu colour above has to
   flip to dark, or the links disappear again.
   ===================================================================== */
.header.sticky {
    background: rgba(255, 255, 255, .97) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    box-shadow: 0 6px 24px rgba(36, 22, 64, .12);
    padding: 6px 0 !important;
}

.header.sticky .navbar .navbar-nav .nav-link,
.header.sticky .navbar-dark .navbar-nav .nav-link,
.header.sticky .navbar-dark .navbar-nav .nav-item .nav-link {
    color: var(--gt-ink) !important;
}

.header.sticky .navbar .navbar-nav .nav-link:hover,
.header.sticky .navbar .navbar-nav .nav-link:focus,
.header.sticky .navbar .navbar-nav .show > .nav-link {
    color: var(--gt-accent) !important;
}

/* the pill keeps its own white type */
.header.sticky .navbar .navbar-nav .nav-link.nav-cta,
.header.sticky .navbar-dark .navbar-nav .nav-item .nav-link.nav-cta {
    color: #fff !important;
}

.header.sticky .navbar .navbar-nav .nav-item > .nav-link:not(.nav-cta)::after {
    background: linear-gradient(90deg, var(--gt-accent), var(--gt-accent-2));
}

/* the logo art is already dark-on-white, so drop its plate when the bar is white */
.header.sticky .navbar-brand img {
    background: transparent;
    box-shadow: none;
    padding: 4px 0;
    height: 46px;
}

/* burger turns dark too */
.header.sticky .navbar-dark .navbar-toggler { border-color: rgba(36, 22, 64, .3); }
.header.sticky .navbar-dark .navbar-toggler i { color: var(--gt-ink); }

@media (max-width: 991px) {
    /* collapsed panel over a white sticky bar needs light ground + dark type */
    .header.sticky #mainNav {
        background: #ffffff;
        box-shadow: 0 10px 30px rgba(36, 22, 64, .14);
    }
    .header.sticky #mainNav .nav-link { color: var(--gt-ink) !important; }
}

/* ---------------------------------------------------------------------
   Back to top — main.js drives `.BackTo` with fadeIn/fadeOut, so the
   element must start hidden by display, not by opacity.
   --------------------------------------------------------------------- */
.back-to-top {
    display: none;
    opacity: 1;
    visibility: visible;
    transform: none;
}
.back-to-top.show { display: grid; }
