/* Executive AI workshop and enquiry pages. Uses the Malaysia site's brand tokens. */
.executive-page,
.contact-page { --action: #81265f; }

.executive-page .btn,
.contact-page .btn { background: var(--action); border-color: var(--action); color: #fff; }
.executive-page .btn:hover,
.contact-page .btn:hover { background: var(--gold); border-color: var(--gold); color: #171117; }
.executive-page a:focus-visible,
.contact-page a:focus-visible,
.contact-page button:focus-visible,
.contact-page input:focus-visible,
.contact-page select:focus-visible,
.contact-page textarea:focus-visible,
.site-menu summary:focus-visible { outline: 3px solid #bd286f; outline-offset: 3px; }

.site-menu { display: none; margin-left: auto; }
.site-menu summary { cursor: pointer; color: var(--plum-deep); font-weight: 700; list-style: none; padding: 10px; }
.site-menu summary::-webkit-details-marker { display: none; }
.site-menu summary::after { content: ' ☰'; }
.site-menu nav { position: absolute; top: 100%; inset-inline: 0; background: #fff; border-bottom: 1px solid var(--line); padding: 10px 22px 16px; display: grid; gap: 4px; }
.site-menu nav a { color: var(--ink); font-weight: 600; padding: 10px 12px; text-decoration: none; border-radius: 8px; }
.site-menu nav a:hover { background: var(--blush); color: var(--plum-deep); }

.executive-hero { background: var(--plum-deep); color: #fff; overflow: hidden; }
.executive-hero-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr); gap: 64px; align-items: center; padding-block: 78px; }
.eyebrow { display: block; color: var(--plum-deep); font-size: 0.8rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.executive-hero .eyebrow { color: #fbd96d; }
.executive-hero h1 { font-size: clamp(2.3rem, 1.45rem + 3vw, 3.6rem); line-height: 1.08; letter-spacing: -0.035em; max-width: 12ch; margin: 16px 0 22px; }
.executive-hero .intro { font-size: 1.12rem; color: #fff; max-width: 38rem; margin: 0 0 28px; }
.executive-hero .btn { background: var(--gold); border-color: var(--gold); color: #171117; }
.executive-hero .btn:hover { background: #fff; border-color: #fff; }
.hero-note { display: block; margin-top: 14px; color: #f4e8ef; font-size: 0.92rem; }
.hero-panel { background: #fff; color: var(--ink); border-radius: 18px; padding: 32px; box-shadow: 14px 14px 0 rgba(249, 196, 40, 0.55); }
.hero-panel .eyebrow { color: var(--plum-deep); }
.hero-panel h2 { margin: 10px 0 23px; font-size: 1.4rem; line-height: 1.25; color: var(--plum-deep); }
.hero-panel ol { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.hero-panel li { display: flex; gap: 14px; align-items: center; border-top: 1px solid var(--line); padding: 13px 0; font-weight: 650; }
.hero-panel li span { color: var(--plum-deep); font-size: 0.8rem; font-weight: 800; }

.executive-section { padding-block: 76px; }
.executive-section h2 { color: var(--plum-deep); font-size: clamp(1.8rem, 1.3rem + 1.3vw, 2.4rem); line-height: 1.2; margin: 8px 0 16px; }
.executive-section .section-lead { max-width: 650px; color: var(--ink-soft); font-size: 1.05rem; }
.topic-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 30px; }
.topic-card { padding: 26px; border: 1px solid var(--line); border-top: 4px solid var(--pink); border-radius: var(--radius); background: #fff; }
.topic-card .number { color: var(--plum-deep); font-size: 0.82rem; font-weight: 800; }
.topic-card h3 { margin: 12px 0 8px; color: var(--plum-deep); font-size: 1.15rem; line-height: 1.3; }
.topic-card p { margin: 0; color: var(--ink-soft); font-size: 0.97rem; }
.executive-split { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.executive-split p { color: var(--ink-soft); }
.executive-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.executive-list li { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 17px 20px; }
.executive-list strong { display: block; color: var(--plum-deep); }
.executive-cta { background: var(--blush); }
.executive-cta p { max-width: 650px; }
.executive-cta .btn { margin-top: 8px; }

.contact-heading { background: var(--blush); padding-block: 54px; }
.contact-heading h1 { color: var(--plum-deep); font-size: clamp(2.2rem, 1.4rem + 2.6vw, 3.25rem); line-height: 1.1; margin: 12px 0 16px; }
.contact-heading p { max-width: 650px; margin: 0; color: var(--ink-soft); font-size: 1.1rem; }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr); gap: 64px; align-items: start; padding-block: 64px 80px; }
.contact-form h2, .contact-aside h2 { margin: 0 0 10px; color: var(--plum-deep); font-size: 1.6rem; }
.contact-intro { margin: 0 0 25px; color: var(--ink-soft); }
.contact-fields { display: grid; gap: 20px; }
.contact-field label { display: block; color: var(--ink); font-weight: 700; margin-bottom: 6px; }
.contact-field label span { color: var(--ink-soft); font-weight: 400; }
.contact-field input, .contact-field select, .contact-field textarea { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid #77717a; border-radius: 7px; background: #fff; color: var(--ink); font: inherit; }
.contact-field textarea { min-height: 135px; resize: vertical; }
.contact-field [aria-invalid='true'] { border: 2px solid #a01739; }
.field-error { color: #991735; margin: 5px 0 0; font-weight: 600; font-size: 0.92rem; }
.form-message { padding: 16px 18px; margin: 0 0 24px; border-left: 4px solid #a01739; background: #fff0f2; color: #67122b; }
.form-message:focus-visible { outline: 3px solid #a01739; outline-offset: 3px; }
.form-message a { color: #67122b; }
.form-success { border-color: #217345; background: #edf8f0; color: #174e31; }
.form-success a { color: #174e31; }
.contact-submit { margin-top: 24px; }
.contact-submit button { font: inherit; cursor: pointer; }
.privacy-note { margin: 12px 0 0; color: var(--ink-soft); font-size: 0.9rem; }
.contact-aside { background: var(--mist); border-radius: 12px; padding: 28px; }
.contact-aside h2 { font-size: 1.3rem; }
.contact-aside p { color: var(--ink-soft); margin: 0 0 18px; }
.contact-aside a { color: var(--plum-deep); font-weight: 700; overflow-wrap: anywhere; }
.contact-aside dl { margin: 24px 0 0; }
.contact-aside dt { color: var(--ink-soft); font-size: 0.88rem; font-weight: 700; margin-top: 14px; }
.contact-aside dd { margin: 1px 0 0; }
.contact-aside .company-note { border-top: 1px solid var(--line); padding-top: 18px; margin: 24px 0 0; font-size: 0.92rem; }
.contact-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* A short feature links the existing Malaysia pages to the new offer. */
.executive-feature { margin-top: 26px; padding: 26px 28px; border-radius: var(--radius); background: var(--plum-deep); color: #fff; display: flex; flex-wrap: wrap; gap: 18px 30px; align-items: center; justify-content: space-between; }
.executive-feature h3 { margin: 0 0 4px; color: #fff; font-size: 1.25rem; }
.executive-feature p { margin: 0; color: #f6e9f1; max-width: 700px; }
.executive-feature a { background: var(--gold); border: 2px solid var(--gold); color: #171117; font-weight: 700; padding: 10px 18px; border-radius: var(--radius); text-decoration: none; }
.executive-feature a:hover { background: #fff; border-color: #fff; }
.executive-feature a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

@media (max-width: 900px) {
  .executive-page .nav-links, .contact-page .nav-links { display: none; }
  .site-menu { display: block; }
  .executive-hero-grid, .executive-split, .contact-layout { grid-template-columns: 1fr; gap: 32px; }
  .executive-hero-grid { padding-block: 56px; }
  .hero-panel { max-width: 540px; }
  .topic-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .site-menu summary { font-size: 14px; white-space: nowrap; padding: 8px 0 8px 8px; }
  .executive-hero-grid { padding-block: 36px; }
  .executive-section, .contact-layout { padding-block: 48px; }
  .hero-panel { padding: 24px; }
  .contact-submit button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .executive-page .btn, .contact-page .btn { transition: none; }
}
