/* GoAI Tech Conclave 2026 — inner pages (about, mission, register) */

/* ---------- page banner ---------- */
.page-hero {
  position: relative; overflow: hidden; isolation: isolate; background: var(--navy-950);
  min-height: 460px; display: flex; align-items: center;
  padding: 140px 0 60px;
}
.page-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; z-index: -3; }
.page-hero::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background:
    linear-gradient(90deg, rgba(2, 13, 42, .97) 0%, rgba(3, 18, 56, .9) 30%, rgba(4, 24, 70, .55) 48%, rgba(4, 24, 70, 0) 66%),
    linear-gradient(0deg, rgba(3, 18, 51, .9) 0%, rgba(3, 18, 51, 0) 22%);
}
.page-hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: url("../public/images/bg-ribbon.svg") left bottom / min(900px, 70%) auto no-repeat; opacity: .75;
}
.page-hero .container { position: relative; }
.page-hero .eyebrow { font-size: 17px; letter-spacing: .3em; margin-bottom: 22px; }
.page-hero__title {
  max-width: 640px; font-family: var(--font-display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(30px, 3.4vw, 48px); line-height: 1.04; letter-spacing: -0.015em; color: #fff;
}
.page-hero__title .grad-text { display: block; background: linear-gradient(90deg, #ffb21d 0%, #ff8f1e 50%, #ff6a1a 100%); -webkit-background-clip: text; background-clip: text; }
.page-hero__sub { margin-top: 18px; max-width: 640px; font-weight: 600; font-size: clamp(19px, 2vw, 27px); line-height: 1.25; color: #dfe6fb; }
.page-hero__text { margin-top: 18px; max-width: 560px; font-size: 18px; line-height: 1.5; font-weight: 300; color: #e7ecfa; }

/* ---------- shared bits ---------- */
.page-section { position: relative; }
.page-section .container { position: relative; z-index: 1; }
.page-section .section-head { margin-bottom: 36px; }
.lead { font-size: clamp(17px, 1.5vw, 20px); line-height: 1.6; color: #dbe3f7; }
.lead + .lead { margin-top: 16px; }

.card {
  position: relative; border-radius: 14px; padding: 30px 28px;
  border: 1.5px solid var(--navy-line);
  background: linear-gradient(120deg, #061a46 0%, #071b44 55%, #0a2050 100%);
  box-shadow: 0 0 24px -10px var(--blue-soft);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card:hover { transform: translateY(-4px); border-color: var(--yellow); box-shadow: 0 0 30px -8px rgba(255, 198, 26, .5); }
.card h3 { font-family: var(--font-body); font-weight: 600; font-size: 24px; color: #fff; }
.card p { margin-top: 12px; font-size: 16.5px; line-height: 1.55; color: #d8e0f5; font-weight: 300; }
.card--warm { border-color: rgba(255, 138, 31, .7); box-shadow: 0 0 24px -10px #ff8a1f; background: linear-gradient(120deg, #1d1a2b 0%, #141a33 55%, #1c1d30 100%); }
.card__icon {
  width: 62px; height: 62px; border-radius: 50%; margin-bottom: 18px;
  display: grid; place-items: center; font-size: 28px; color: #cfe0ff;
  background: radial-gradient(circle, #1450c7, #0b2f80);
}
.card__icon .i { stroke-width: 1.7; }
.card--warm .card__icon { color: var(--yellow); background: radial-gradient(circle, rgba(255, 198, 26, .22), rgba(255, 198, 26, .04)); border: 1.5px solid rgba(255, 198, 26, .6); }

.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.grid-5 { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }

/* ---------- about: split intro ---------- */
.split { display: grid; grid-template-columns: 1.15fr 1fr; gap: 48px; align-items: center; }
.split__media { position: relative; border-radius: 16px; overflow: hidden; border: 1.5px solid var(--navy-line); aspect-ratio: 16 / 10; }
.split__media img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- quote cards ---------- */
.quote-card {
  position: relative; display: grid; grid-template-columns: 120px minmax(0, 1fr); margin: 0; gap: 26px; align-items: start;
  padding: 32px 30px; border-radius: 16px; border: 1.5px solid rgba(255, 138, 31, .7);
  background: linear-gradient(120deg, #1d1a2b 0%, #141a33 55%, #1c1d30 100%);
  box-shadow: 0 0 26px -10px #ff8a1f;
}
.quote-card__mark { position: absolute; top: 18px; right: 22px; font-size: 54px; color: rgba(255, 198, 26, .28); }
.quote-card__photo {
  width: 120px; height: 120px; border-radius: 50%; object-fit: cover; display: block;
  background: radial-gradient(circle at 50% 35%, #1a4cb8 0%, #0a2a73 55%, #031233 100%);
  border: 2.5px solid var(--yellow); box-shadow: 0 0 18px -4px rgba(255, 198, 26, .55);
}
.quote-card blockquote { margin: 0; padding-right: 56px; font-size: 17.5px; line-height: 1.6; color: #e9eefc; font-weight: 300; }
.quote-card figcaption { margin-top: 18px; font-size: 15px; color: var(--muted); }
.quote-card figcaption b { display: block; font-size: 18px; font-weight: 600; color: var(--yellow); }
.quote-card figure { margin: 0; }

/* ---------- attend tiles ---------- */
.tile {
  position: relative; aspect-ratio: 1 / 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 14px;
  padding: 24px; border-radius: 14px; border: 2px solid var(--yellow); overflow: hidden;
  background: radial-gradient(circle at 80% 10%, rgba(255, 166, 26, .22), transparent 55%), linear-gradient(160deg, #10285f, #061535);
  box-shadow: 0 0 26px -8px rgba(255, 198, 26, .55);
  transition: transform .25s ease, box-shadow .25s ease;
}
.tile:hover { transform: translateY(-4px); box-shadow: 0 0 34px -4px rgba(255, 198, 26, .7); }
.tile__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.tile::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(3, 18, 51, .72) 0%, rgba(3, 18, 51, .35) 40%, rgba(3, 18, 51, .92) 100%); }
.tile > .i, .tile > h3 { position: relative; z-index: 2; }
.tile .i { font-size: 52px; color: var(--yellow); stroke-width: 1.5; margin-bottom: auto; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .5)); }
.tile h3 { font-family: var(--font-body); font-weight: 600; font-size: 22px; line-height: 1.2; color: #fff; text-shadow: 0 2px 8px rgba(0, 0, 0, .6); }

/* ---------- expect items ---------- */
.expect {
  position: relative; padding: 26px 24px 28px; border-radius: 14px;
  border: 1.5px solid var(--navy-line); background: linear-gradient(120deg, #061a46 0%, #0a2050 100%);
  transition: border-color .25s, transform .25s;
}
.expect:hover { border-color: #ff9a1f; transform: translateY(-4px); }
.expect__icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; font-size: 26px; color: var(--yellow); background: radial-gradient(circle, rgba(255, 198, 26, .22), rgba(255, 198, 26, .04)); border: 1.5px solid rgba(255, 198, 26, .6); }
.expect h3 { margin-top: 18px; font-family: var(--font-body); font-weight: 600; font-size: 19px; line-height: 1.25; color: #fff; }
.expect p { margin-top: 8px; font-size: 15px; line-height: 1.5; color: #d0d9f1; font-weight: 300; }

/* ---------- CTA band ---------- */
.cta-band { position: relative; overflow: hidden; isolation: isolate; padding: clamp(56px, 6vw, 84px) 0; background: linear-gradient(100deg, #0a2a73 0%, #07204f 50%, #0b2a66 100%); border-top: 1px solid var(--navy-line); border-bottom: 1px solid var(--navy-line); }
.cta-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("../public/images/waves-warm.svg") right center / min(760px, 90%) auto no-repeat; opacity: .6; }
.cta-band .container { display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.cta-band h2 { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: clamp(28px, 3.2vw, 44px); line-height: 1.05; color: #fff; }
.cta-band p { margin-top: 12px; font-size: 18px; color: #dbe3f7; max-width: 520px; }
.cta-band__actions { display: flex; gap: 16px; flex-wrap: wrap; }

/* ---------- mission ---------- */
.goal { position: relative; padding-top: 34px; }
.goal__num { position: absolute; top: 14px; right: 22px; font-family: var(--font-display); font-weight: 900; font-size: 44px; color: rgba(255, 198, 26, .3); line-height: 1; }
.pillars--page { max-width: none; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 0; }
.pillars--page .pillar { padding: 26px 16px; border-radius: 14px; border: 1.5px solid var(--navy-line); background: linear-gradient(120deg, #061a46, #0a2050); }
.pillars--page .pillar + .pillar::before { display: none; }
.pillars--page .pillar__icon { width: 92px; height: 92px; font-size: 38px; margin-bottom: 16px; }
.pillars--page .pillar h3 { font-size: 20px; }
.action-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 22px; }
.action-grid .card { grid-column: span 2; display: flex; flex-direction: column; }
.action-grid .card:nth-child(4), .action-grid .card:nth-child(5) { grid-column: span 3; }
.action-grid .card h3 { font-size: 21px; }
.action-grid .card__logo { max-width: 300px; margin-top: 18px; border-radius: 10px; overflow: hidden; border: 1.5px solid var(--navy-line); background: #fff; }
.action-grid .card__logo img { width: 100%; height: auto; }
.action-grid .card--logo { padding-bottom: 28px; }

/* ---------- register ---------- */
.opt-card { display: flex; flex-direction: column; gap: 0; scroll-margin-top: 120px; }
.opt-card .btn { margin-top: auto; align-self: flex-start; }
.opt-card p { margin-bottom: 22px; }

.reg-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--navy-line); border-radius: 10px; background: #061536; margin-bottom: 26px; }
.reg-tabs .tab b { font-size: 15px; }
.reg-tabs .tab { display: block; width: 100%; }
.reg-wrap { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.25fr; gap: 40px; align-items: start; }
.reg-side h3 { font-family: var(--font-body); font-weight: 600; font-size: 26px; color: #fff; }
.reg-side p { margin-top: 12px; font-size: 16.5px; line-height: 1.6; color: #d8e0f5; font-weight: 300; }
.reg-side .bar { margin-top: 20px; }
.reg-panel { display: none; scroll-margin-top: 120px; }
.reg-panel.is-active { display: block; }
.reg-box { padding: 30px 28px; border-radius: 16px; border: 1.5px solid #ff8a1f; background: #061536; box-shadow: 0 0 26px -8px rgba(255, 140, 30, .4); }
.reg-box .form { margin-top: 0; }
.reg-box h3 { font-family: var(--font-body); font-weight: 600; font-size: 22px; color: #fff; margin-bottom: 18px; }
.reg-box .form-msg { margin-top: 14px; }
.reg-anchor { display: block; height: 0; scroll-margin-top: 120px; }

.contact-split { display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; align-items: stretch; }
.contact-split .contact-form-wrap, .contact-split .reg-box { height: 100%; }
.contact-list { display: grid; grid-template-columns: 1fr; grid-auto-rows: 1fr; gap: 14px; align-content: stretch; }
.contact-list .contact-card { min-height: 110px; }
.reg-anchor { position: absolute; }
.contact-form-wrap .reg-box { border-color: rgba(76, 122, 230, .7); box-shadow: 0 0 26px -10px var(--blue-soft); }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .grid-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pillars--page { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-3 > .card:last-of-type:nth-of-type(odd) { grid-column: 1 / -1; }
  .contact-split { grid-template-columns: 1fr; gap: 28px; }
  .contact-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reg-wrap { grid-template-columns: 1fr; gap: 28px; }
  .split { grid-template-columns: 1fr; gap: 30px; }
  .page-hero::before { background: linear-gradient(90deg, rgba(2,13,42,.94) 0%, rgba(3,18,56,.8) 55%, rgba(4,24,70,.5) 100%), linear-gradient(0deg, rgba(3,18,51,.9), rgba(3,18,51,0) 30%); }
}
@media (max-width: 860px) {
  .page-hero { padding: 130px 0 56px; min-height: 0; }
  .grid-2 { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: 1fr; }
  .contact-list { grid-template-columns: 1fr; }
  .quote-card { grid-template-columns: minmax(0, 1fr); }
  .quote-card__photo { justify-self: start; }
  .action-grid { grid-template-columns: 1fr; }
  .action-grid .card, .action-grid .card:nth-child(4), .action-grid .card:nth-child(5) { grid-column: auto; }
  .cta-band .container { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
  .page-hero { padding: 124px 0 44px; }
  .page-hero .eyebrow { font-size: 13px; letter-spacing: .22em; }
  .page-hero .eyebrow::after { width: 60px; }
  .page-hero__text { font-size: 16px; }
  .grid-5, .grid-4 { grid-template-columns: 1fr 1fr; gap: 12px; }
  .grid-5 { grid-template-columns: 1fr; }
  .page-section.section { padding: 52px 0; }
  .page-section .section-head { margin-bottom: 26px; }
  .tile { padding: 16px; }
  .tile .i { font-size: 38px; }
  .tile h3 { font-size: 17px; }
  .pillars--page { grid-template-columns: 1fr; }
  .card, .reg-box { padding: 24px 20px; }
  .reg-tabs { grid-template-columns: 1fr 1fr; }
  .reg-tabs .tab:nth-child(3)::before { display: none; }
  .reg-tabs .tab:nth-child(n+3) { border-top: 1px solid var(--navy-line); }
  .cta-band__actions { width: 100%; }
  .cta-band__actions .btn { width: 100%; padding: 0 20px; font-size: 17px; white-space: normal; }
  .opt-card .btn { white-space: normal; text-align: center; }
}
@media (max-width: 400px) {
  .grid-5, .grid-4 { gap: 10px; }
  .expect { padding: 20px 14px; }
}

/* keep the eyebrow text in one run so the "o" span does not split into its own flex item */
.page-hero .eyebrow, .page-section .eyebrow { display: block; }
.page-hero .eyebrow::after, .page-section .eyebrow::after { display: inline-block; vertical-align: middle; margin-left: 16px; }

/* ---------- expect grid (3 + 2 layout) ---------- */
.expect-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; }
.expect-grid .expect { grid-column: span 2; }
.expect-grid .expect:nth-child(n+4) { grid-column: span 3; }
@media (max-width: 1100px) {
  .expect-grid .expect, .expect-grid .expect:nth-child(n+4) { grid-column: span 3; }
  .expect-grid .expect:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .expect-grid { grid-template-columns: 1fr; }
  .expect-grid .expect, .expect-grid .expect:nth-child(n+4), .expect-grid .expect:last-child:nth-child(odd) { grid-column: auto; }
}

/* ---------- mission: wide policy card ---------- */
.action-grid .card--wide { grid-column: 1 / -1; }
.action-grid .card:nth-child(n+2):nth-child(-n+5) { grid-column: span 3; }
@media (max-width: 860px) {
  .action-grid .card--wide, .action-grid .card:nth-child(n+2):nth-child(-n+5) { grid-column: auto; }
}

/* ---------- speakers: to be announced ---------- */
.tba { max-width: 720px; margin: 0 auto; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 18px; padding: 48px 32px; border-radius: 16px; border: 1.5px solid rgba(255, 138, 31, .7); background: linear-gradient(120deg, #1d1a2b 0%, #141a33 55%, #1c1d30 100%); box-shadow: 0 0 26px -10px #ff8a1f; }
.tba .card__icon { margin-bottom: 0; }
.tba .eyebrow { margin: 0; }
.tba .lead { max-width: 520px; }

/* room for the latest-updates ticker under the nav */
.page-hero { padding-top: 200px; }
@media (max-width: 860px) { .page-hero { padding-top: 170px; } }

/* ---------- registration: embedded Google Form ---------- */
.reg-box .gform { display: block; width: 100%; height: 900px; border: 0; border-radius: 10px; background: #fff; }
.gform__alt { margin-top: 12px; font-size: 14px; color: var(--muted); }
.gform__alt a { color: var(--yellow); text-decoration: underline; }
@media (max-width: 640px) { .reg-box .gform { height: 760px; } }
