:root {
          --navy: #0D2145;
          --navy-dark: #0A1A35;
          --orange: #E87722;
          --light: #F8F9FC;
          --white: #FFFFFF;
          --text: #444444;
          --muted: #707887;
          --line: rgba(13,33,69,0.12);
          --shadow: 0 18px 50px rgba(13,33,69,0.12);
          --radius: 8px;
          --heading: "Playfair Display", Georgia, serif;
          --body: "Inter", Arial, sans-serif;
        }
        * {
          box-sizing:border-box;
          margin:0;
          padding:0
        }
        html {
          scroll-behavior:smooth;
          scroll-padding-top:84px
        }
        body {
          background:var(--light);
          color:var(--text);
          font-family:var(--body);
          line-height:1.7;
          overflow-x:hidden
        }
        body.is-loading {
          overflow:hidden
        }
        body.is-loading .site-header,body.is-loading main,body.is-loading .site-footer {
          opacity:0;
          visibility:hidden
        }
        a {
          color:inherit;
          text-decoration:none
        }
        button {
          border:0;
          cursor:pointer;
          font:inherit
        }
        .container {
          width:min(1120px,calc(100% - 40px));
          margin:0 auto
        }
        .section {
          padding:96px 0;
          position:relative
        }
        .page-loader {
          align-items:center;
          background:var(--white);
          display:flex;
          flex-direction:column;
          gap:28px;
          inset:0;
          justify-content:center;
          opacity:1;
          position:fixed;
          transition:opacity 450ms ease,visibility 450ms ease;
          visibility:visible;
          z-index:9999
        }
        .page-loader.done {
          opacity:0;
          pointer-events:none;
          visibility:hidden
        }
        .loader-logo {
          font-size:clamp(2.2rem,7vw,4.6rem);
          font-weight:800
        }
        .loader-progress {
          background:rgba(13,33,69,.12);
          border-radius:999px;
          height:3px;
          overflow:hidden;
          width:min(280px,64vw)
        }
        .loader-progress span {
          animation:loaderFill 1.5s linear forwards;
          background:var(--orange);
          display:block;
          height:100%;
          transform:scaleX(0);
          transform-origin:left;
          width:100%
        }
        @keyframes loaderFill {
          to {
            transform:scaleX(1)
          }
          
        }
        .site-header {
          position:fixed;
          inset:0 0 auto 0;
          z-index:1000;
          background:rgba(255,255,255,.94);
          border-bottom:1px solid rgba(13,33,69,.08);
          box-shadow:0 10px 30px rgba(13,33,69,.08);
          backdrop-filter:blur(16px);
          transition:background 220ms ease
        }
        .site-header.scrolled {
          background:var(--navy)
        }
        .site-header.scrolled .brand-penta,.site-header.scrolled .nav-link {
          color:var(--white)
        }
        .site-header.scrolled .brand-sub {
          color:rgba(255,255,255,.68)
        }
        .site-header.scrolled .nav-link:hover,.site-header.scrolled .nav-link.active {
          background:rgba(232,119,34,.16);
          color:var(--orange)
        }
        .nav-wrap {
          align-items:center;
          display:flex;
          justify-content:space-between;
          min-height:78px;
          gap:24px
        }
        .brand {
          display:inline-flex;
          flex-direction:column;
          line-height:1.05
        }
        .brand-main {
          font-size:1.32rem;
          font-weight:800
        }
        .brand-penta {
          color:var(--navy)
        }
        .brand-minds {
          color:var(--orange)
        }
        .brand-sub {
          color:var(--muted);
          font-size:.72rem;
          font-weight:800;
          letter-spacing:.12em;
          margin-top:4px;
          text-transform:uppercase
        }
        .nav-links {
          align-items:center;
          display:flex;
          gap:8px;
          list-style:none
        }
        .nav-link {
          border-radius:999px;
          color:var(--navy);
          display:inline-flex;
          font-size:.92rem;
          font-weight:700;
          padding:8px 12px;
          white-space:nowrap
        }
        .nav-link:hover,.nav-link.active {
          background:rgba(232,119,34,.12);
          color:var(--orange)
        }
        .menu-toggle {
          align-items:center;
          background:var(--navy);
          border-radius:8px;
          display:none;
          height:42px;
          justify-content:center;
          width:46px
        }
        .menu-toggle span {
          position:relative
        }
        .menu-toggle span:before {
          transform:translateY(-7px)
        }
        .menu-toggle span:after {
          transform:translateY(7px)
        }
        .menu-toggle.open span {
          background:transparent
        }
        .menu-toggle.open span:before {
          transform:rotate(45deg)
        }
        .menu-toggle.open span:after {
          transform:rotate(-45deg)
        }
        .hero {
          align-items:center;
          background:linear-gradient(135deg,#0D2145 0%,#132A55 52%,#0A1A35 100%);
          display:flex;
          min-height:100vh;
          overflow:hidden;
          padding:118px 0 80px;
          position:relative
        }
        .hero-network-canvas {
          inset:0;
          position:absolute;
          width:100%;
          height:100%;
          z-index:0
        }
        .hero-content {
          position:relative;
          z-index:2
        }
        .eyebrow-badge {
          border:1px solid rgba(232,119,34,.72);
          border-radius:999px;
          color:white;
          display:inline-flex;
          font-size:.78rem;
          font-weight:900;
          letter-spacing:.12em;
          margin-bottom:22px;
          padding:8px 14px
        }
        .hero h1,.hero h2 {
          font-family:var(--heading);
          font-size:clamp(3.2rem,8vw,7.6rem);
          font-weight:800;
          line-height:.95;
          max-width:960px
        }
        .hero h1 {
          color:white
        }
        .hero h2 {
          color:var(--orange);
          margin-top:10px
        }
        .hero p {
          color:rgba(255,255,255,.86);
          font-size:clamp(1.05rem,2vw,1.28rem);
          font-weight:600;
          margin-top:28px;
          max-width:680px
        }
        .button-row {
          display:flex;
          flex-wrap:wrap;
          gap:14px;
          margin-top:34px
        }
        .btn {
          align-items:center;
          border-radius:8px;
          display:inline-flex;
          font-weight:800;
          justify-content:center;
          min-height:50px;
          padding:13px 22px;
          transition:all 200ms ease
        }
        .btn:hover {
          box-shadow:0 14px 28px rgba(0,0,0,.16);
          transform:translateY(-2px)
        }
        .btn-orange {
          background:var(--orange);
          color:white
        }
        .btn-orange:hover {
          background:#cc6419
        }
        .btn-white-outline {
          border:2px solid rgba(255,255,255,.86);
          color:white
        }
        .btn-white-outline:hover {
          background:white;
          color:var(--navy)
        }
        .btn-navy-outline {
          border:2px solid var(--navy);
          color:var(--navy)
        }
        .btn-navy-outline:hover {
          background:var(--navy);
          color:white
        }
        .stats-bar {
          background:var(--navy);
          color:white;
          padding:28px 0
        }
        .stats-grid {
          display:grid;
          gap:18px;
          grid-template-columns:repeat(3,1fr);
          text-align:center
        }
        .stat strong {
          display:block;
          font-family:var(--heading);
          font-size:clamp(1.5rem,3vw,2.15rem)
        }
        .stat span {
          color:rgba(255,255,255,.68);
          display:block;
          font-size:.92rem;
          font-weight:800;
          letter-spacing:.08em;
          text-transform:uppercase
        }
        .section-title {
          color:var(--navy);
          font-family:var(--heading);
          font-size:clamp(2.2rem,5vw,4rem);
          line-height:1.05
        }
        .section-title.white {
          color:white
        }
        .orange-rule {
          background:var(--orange);
          border-radius:999px;
          display:block;
          height:4px;
          width:82px;
          margin-top:18px
        }
        .orange-divider {
          background:var(--orange);
          height:4px
        }
        .subtitle,.lead-copy {
          color:var(--muted);
          font-size:1.08rem;
          margin-top:20px;
          max-width:780px
        }
        .lead-copy {
          color:#4a4f5b;
          line-height:1.85
        }
        .split {
          display:grid;
          gap:54px;
          grid-template-columns:.86fr 1.14fr
        }
        .cards-3,.scope-grid,.objectives-grid,.resource-grid {
          display:grid;
          gap:24px;
          grid-template-columns:repeat(3,1fr);
          margin-top:42px
        }
        .module-grid {
          display:grid;
          gap:24px;
          grid-template-columns:repeat(2,1fr);
          margin-top:42px
        }
        .info-card,.team-card,.objective-card,.resource-card,.associate-card {
          background:white;
          border:1px solid var(--line);
          border-radius:var(--radius);
          padding:30px 22px;
          transition:.22s
        }

        #ca
        {
          position: relative;
          left: 200px;
        }

        .info-card:hover,.team-card:hover,.objective-card:hover,.resource-card:hover,.associate-card:hover {
          box-shadow:var(--shadow);
          transform:translateY(-5px)
        }
        .info-card h3,.objective-card h3,.resource-card h3 {
          color:var(--navy);
          font-size:1.05rem;
          font-weight:800;
          margin-top:18px
        }
        .info-card p,.objective-card p,.resource-card p {
          color:var(--muted);
          font-size:.96rem;
          margin-top:10px
        }
        .icon {
          align-items:center;
          background:rgba(232,119,34,.12);
          border-radius:50%;
          color:var(--orange);
          display:inline-flex;
          height:56px;
          justify-content:center;
          width:56px
        }
        .icon svg {
          height:28px;
          width:28px
        }
        .badge {
          border:1px solid rgba(232,119,34,.42);
          border-radius:999px;
          color:var(--orange);
          display:inline-flex;
          font-size:.78rem;
          font-weight:800;
          padding:6px 12px
        }
        .dark-section,.contact-section {
          background:var(--navy);
          color:white
        }
        .dark-section .subtitle,.contact-section .subtitle {
          color:rgba(255,255,255,.72)
        }
        .scope-card {
          background:rgba(255,255,255,.08);
          border:1px solid rgba(255,255,255,.14);
          border-radius:var(--radius);
          color:white;
          padding:30px 22px
        }
        .scope-card h3 {
          color:white
        }
        .scope-card p {
          color:rgba(255,255,255,.72);
          margin-top:10px
        }
        .light-card {
          background:white;
          border-color:var(--line);
          color:var(--text)
        }
        .light-card h3 {
          color:var(--navy)
        }
        .light-card p {
          color:var(--muted)
        }
        .focus-list {
          display:grid;
          gap:14px;
          margin-top:40px
        }
        .focus-bar {
          align-items:center;
          background:rgba(255,255,255,.08);
          border:1px solid rgba(255,255,255,.14);
          border-radius:var(--radius);
          color:white;
          display:flex;
          font-weight:800;
          min-height:62px;
          padding:16px 22px
        }
        .focus-bar:nth-child(even) {
          background:var(--orange);
          border-color:var(--orange)
        }
        .project-card {
          background:white;
          border:1px solid var(--line);
          border-radius:12px;
          box-shadow:0 8px 32px rgba(13,33,69,.07);
          margin-top:48px;
          overflow:hidden;
          transition:.22s
        }
        .project-card:hover {
          box-shadow:var(--shadow);
          transform:translateY(-4px)
        }
        .project-card-header {
          background:var(--navy);
          color:white;
          padding:32px 36px;
          position:relative
        }
        .project-card-header:after {
          background:var(--orange);
          bottom:0;
          content:"";
          height:4px;
          left:0;
          position:absolute;
          width:82px
        }
        .project-number {
          color:var(--orange);
          font-size:.78rem;
          font-weight:900;
          letter-spacing:.1em;
          text-transform:uppercase
        }
        .project-title {
          font-family:var(--heading);
          font-size:clamp(1.5rem,3vw,2.2rem);
          font-weight:800;
          color:white
        }
        .project-tagline {
          color:rgba(255,255,255,.74);
          font-weight:600;
          margin-top:10px
        }
        .project-body {
          padding:36px
        }
        .project-meta-grid {
          display:grid;
          gap:18px;
          grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
          margin-bottom:28px
        }
        .project-meta-item {
          border-left:3px solid var(--orange);
          padding-left:14px
        }
        .project-meta-label {
          color:var(--muted);
          font-size:.78rem;
          font-weight:800;
          letter-spacing:.08em;
          text-transform:uppercase
        }
        .project-meta-value {
          color:var(--navy);
          font-weight:700
        }
        .project-overview {
          color:#4a4f5b;
          font-size:1.02rem;
          line-height:1.75;
          margin-bottom:28px
        }
        .project-sections {
          display:grid;
          gap:20px;
          grid-template-columns:repeat(auto-fit,minmax(240px,1fr))
        }
        .project-section-block {
          background:var(--light);
          border:1px solid var(--line);
          border-radius:var(--radius);
          padding:22px
        }
        .project-section-block h4 {
          color:var(--navy);
          font-size:.9rem;
          font-weight:800;
          letter-spacing:.06em;
          text-transform:uppercase
        }
        .project-section-block p {
          color:var(--muted);
          font-size:.93rem
        }
        .project-timeline-strip {
          border-top:1px solid var(--line);
          margin-top:28px;
          padding-top:24px
        }
        .timeline-strip-items,.affiliation-chips,.social-row,.pill-row {
          display:flex;
          flex-wrap:wrap;
          gap:12px
        }
        .timeline-strip-item {
          align-items:center;
          background:var(--light);
          border:1px solid var(--line);
          border-radius:8px;
          display:flex;
          gap:12px;
          padding:12px 16px;
          flex:1 1 180px
        }
        .timeline-strip-dot,.affiliation-chip-dot {
          background:var(--orange);
          border-radius:50%;
          height:10px;
          width:10px;
          flex-shrink:0;
          animation: blink 2s;
        }
        .timeline-strip-date {
          color:var(--orange);
          display:block;
          font-size:.78rem;
          font-weight:900
        }
        .timeline-strip-event {
          color:var(--navy);
          font-size:.88rem;
          font-weight:700
        }
        .affiliation-chip {
          align-items:center;
          background:white;
          border:1px solid var(--line);
          border-radius:8px;
          display:inline-flex;
          gap:8px;
          padding:8px 14px;
          font-size:.88rem;
          font-weight:700;
          color:var(--navy)
        }
        .note {
          color:var(--muted);
          font-size:.92rem;
          font-style:italic;
          margin-top:18px
        }
        .team-grid {
          display:grid;
          gap:24px;
          grid-template-columns:repeat(6,1fr);
          margin-top:42px
        }
        .team-card {
          grid-column:span 2;
          text-align:center
        }
        .team-card:nth-child(4) {
          grid-column:2/span 2
        }
        .team-card:nth-child(5) {
          grid-column:4/span 2
        }
        .associate-row {
          display:grid;
          gap:24px;
          grid-template-columns:repeat(2,minmax(220px,320px));
          justify-content:center;
          margin-top:24px
        }
        .associate-card {
          text-align:center
        }
        .avatar {
          align-items:center;
          background:var(--navy);
          border-radius:50%;
          color:white;
          display:inline-flex;
          font-size:1.2rem;
          font-weight:800;
          height:92px;
          justify-content:center;
          margin-bottom:18px;
          overflow:hidden;
          position:relative;
          width:92px
        }
        .avatar:before {
          content:attr(data-initials)
        }
        .avatar img {
          inset:0;
          height:100%;
          object-fit:cover;
          position:absolute;
          width:100%
        }
        .avatar-upload {
          align-items:center;
          background:rgba(13,33,69,.62);
          color:white;
          display:none!important;
          height:100%;
          inset:0;
          justify-content:center;
          opacity:0;
          position:absolute;
          width:100%;
          z-index:2
        }
        .avatar-upload:before {
          content:"Upload";
          font-size:.72rem;
          font-weight:800
        }
        .avatar-input {
          display:none
        }
        .avatar-reset {
          background:transparent;
          color:var(--muted);
          display:none!important;
          font-size:.8rem;
          font-weight:700;
          margin:12px auto 0
        }
        body.admin-mode .avatar-upload,body.admin-mode .avatar-reset {
          display:inline-flex!important
        }
        body.admin-mode .avatar-reset {
          display:block!important
        }
        .avatar:hover .avatar-upload {
          opacity:1
        }
        .team-card h3,.associate-card h3 {
          color:var(--navy);
          font-size:1.18rem;
          font-weight:800
        }
        .member-meta {
          color:var(--muted);
          font-size:.9rem;
          margin:8px 0 12px
        }
        .linkedin,.social-btn {
          align-items:center;
          border:1px solid rgba(13,33,69,.16);
          border-radius:999px;
          color:var(--navy);
          display:inline-flex;
          font-weight:800;
          justify-content:center;
          min-height:36px;
          min-width:36px;
          padding:7px 12px
        }
        .linkedin:hover,.social-btn:hover {
          background:var(--orange);
          border-color:var(--orange);
          color:white
        }
        .ecosystem-tree {
          margin-top:42px;
          text-align:center
        }
        .ecosystem-root {
          background:var(--navy);
          border-radius:var(--radius);
          color:white;
          display:inline-block;
          font-family:var(--heading);
          font-size:1.6rem;
          font-weight:800;
          padding:22px 42px
        }
        .ecosystem-branches {
          border-top:2px solid var(--line);
          display:grid;
          gap:22px;
          grid-template-columns:repeat(5,1fr);
          margin-top:48px;
          padding-top:34px;
          position:relative
        }
        .ecosystem-branches:before {
          background:var(--line);
          content:"";
          height:48px;
          left:50%;
          position:absolute;
          top:-48px;
          width:2px
        }
        .division-card {
          background:white;
          border:1px solid var(--line);
          border-left:3px solid var(--orange);
          border-radius:var(--radius);
          color:var(--navy);
          font-weight:800;
          min-height:108px;
          padding:22px 18px;
          text-align:left
        }
        .email-link {
          color:var(--orange);
          display:inline-block;
          font-family:var(--heading);
          font-size:clamp(2rem,5vw,4rem);
          font-weight:800;
          line-height:1.08;
          margin-top:20px;
          margin-bottom: 28px;
          overflow-wrap:anywhere
        }
        .contact-section .social-btn {
          border-color:rgba(255,255,255,.18);
          color:white
        }
        .affiliation-line {
          color:rgba(255,255,255,.72);
          font-weight:700;
          margin-top:24px
        }
        .live-counter {
          align-items:center;
          border:1px solid var(--line);
          border-radius:999px;
          color:var(--navy);
          display:inline-flex;
          font-weight:900;
          gap:10px;
          margin-top:22px;
          margin-bottom: 20px;
          padding:10px 16px;
        }
        .pill {
          background:var(--light);
          border:1px solid var(--line);
          border-radius:999px;
          color:var(--navy);
          font-weight:800;
          margin-bottom: 20px;
          padding:8px 14px;
        }
        .site-footer {
          background:var(--navy-dark);
          color:white
        }
        .footer-grid {
          align-items:center;
          display:grid;
          gap:22px;
          grid-template-columns:1fr auto 1fr;
          padding:34px 0
        }
        .footer-links {
          display:flex;
          flex-wrap:wrap;
          gap:14px;
          justify-content:center;
          list-style:none;
        }
        .footer-links a {
          color:rgba(255,255,255,.74);
          font-size:.9rem;
          font-weight:700
        }
        .footer-copy {
          color:rgba(255,255,255,.72);
          font-size:.9rem;
          font-weight:700;
          text-align:right
        }
        .footer-line {
          background:var(--orange);
          height:3px
        }
        .redirect-overlay {
          align-items:center;
          background:white;
          display:flex;
          flex-direction:column;
          inset:0;
          justify-content:center;
          opacity:0;
          pointer-events:none;
          position:fixed;
          transition:opacity 300ms ease;
          z-index:9998
        }
        .redirect-overlay.active {
          opacity:1;
          pointer-events:all
        }
        .redirect-spinner {
          border:3px solid var(--line);
          border-top-color:var(--orange);
          border-radius:50%;
          height:40px;
          width:40px;
          animation:spin 700ms linear infinite
        }
        @keyframes spin {
          to {
            transform:rotate(360deg)
          }
          
        }
        .redirect-label {
          color:var(--navy);
          font-weight:700;
          margin-top:18px
        }
        .admin-access-btn {
          align-items:center;
          background:var(--navy);
          border-radius:50%;
          bottom:24px;
          display:flex;
          height:42px;
          justify-content:center;
          position:fixed;
          right:24px;
          width:42px;
          z-index:8999
        }
        .admin-modal {
          align-items:center;
          background:rgba(10,26,53,.58);
          display:none;
          inset:0;
          justify-content:center;
          padding:20px;
          position:fixed;
          z-index:9000
        }
        .admin-modal.open {
          display:flex
        }
        .admin-dialog {
          background:white;
          border-radius:var(--radius);
          box-shadow:var(--shadow);
          max-width:420px;
          padding:28px;
          width:100%
        }
        .admin-dialog h2 {
          color:var(--navy);
          font-family:var(--heading)
        }
        .admin-dialog label {
          color:var(--navy);
          display:block;
          font-weight:800;
          margin-top:18px
        }
        .admin-dialog input {
          border:1px solid rgba(13,33,69,.16);
          border-radius:var(--radius);
          min-height:44px;
          padding:10px 12px;
          width:100%
        }
        .admin-actions {
          display:flex;
          gap:10px;
          justify-content:flex-end;
          margin-top:18px
        }
        .admin-actions button {
          border-radius:var(--radius);
          font-weight:800;
          padding:10px 14px
        }
        .admin-cancel-btn {
          background:rgba(13,33,69,.08);
          color:var(--navy)
        }
        .admin-login-btn {
          background:var(--orange);
          color:white
        }
        .admin-error {
          color:#c2410c;
          display:none;
          font-weight:800
        }
        .admin-error.visible {
          display:block
        }
        .reveal {
          opacity:0;
          transform:translateY(24px);
          transition:opacity 700ms ease,transform 700ms ease
        }
        .reveal.visible {
          opacity:1;
          transform:translateY(0)
        }
      .menu-toggle {
      align-items: center;
      background: var(--navy);
      border-radius: 8px;
      display: none;
      height: 44px;
      justify-content: center;
      width: 44px;
    }

    .menu-toggle span {
      background: var(--white);
      border-radius: 99px;
      display: block;
      height: 2px;
      position: relative;
      width: 22px;
    }

    .menu-toggle span::before,
    .menu-toggle span::after {
      background: var(--white);
      border-radius: 99px;
      content: "";
      height: 2px;
      left: 0;
      position: absolute;
      transition: transform 200ms ease, top 200ms ease;
      width: 22px;
    }

    .menu-toggle span::before {
      top: -7px;
    }

    .menu-toggle span::after {
      top: 7px;
    }

    .menu-toggle.open span {
      background: transparent;
    }

    .menu-toggle.open span::before {
      top: 0;
      transform: rotate(45deg);
    }

    .menu-toggle.open span::after {
      top: 0;
      transform: rotate(-45deg);
    }
.live-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #ff6b00;
  box-shadow: 0 0 8px #ff6b00;
  animation: livePulse 1.5s ease-in-out infinite;
}

@keyframes livePulse {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 107, 0, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 8px rgba(255, 107, 0, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 107, 0, 0);
  }
}



/* =========================================================
   PENTA MINDS — UNIVERSAL CONTACT SECTION
   Brand: Navy #0D2145 | Orange #E87722
   Fonts: Inter + Playfair Display
   ========================================================= */

:root {
  --pm-contact-navy: #0D2145;
  --pm-contact-orange: #E87722;
  --pm-contact-white: #FFFFFF;
  --pm-contact-body-font: "Inter", Arial, sans-serif;
  --pm-contact-heading-font: "Playfair Display", Georgia, serif;
}

/* Section foundation */
.pm-contact {
  background: var(--pm-contact-navy);
  color: var(--pm-contact-white);
  padding: clamp(64px, 8vw, 100px) 0;
  position: relative;
  width: 100%;
}

.pm-contact,
.pm-contact * {
  box-sizing: border-box;
}

.pm-contact__container {
  width: min(1120px, calc(100% - 40px));
  margin-inline: auto;
}

/* Contact heading */
.pm-contact__title {
  color: var(--pm-contact-white);
  font-family: var(--pm-contact-body-font);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  line-height: 1.2;
  margin: 0 0 18px;
}

/* Optional description */
.pm-contact__description {
  color: rgba(255, 255, 255, 0.78);
  font-family: var(--pm-contact-body-font);
  font-size: 1rem;
  line-height: 1.8;
  margin: 0 0 12px;
  max-width: 760px;
}

/* Email address */
.pm-contact__email {
  color: var(--pm-contact-orange);
  display: inline-block;
  font-family: var(--pm-contact-heading-font);
  font-size: clamp(1.6rem, 5vw, 4rem);
  font-weight: 800;
  line-height: 1.2;
  margin: 18px 0 28px;
  max-width: 100%;
  overflow-wrap: anywhere;
  text-decoration: none;
  transition: color 180ms ease;
}

.pm-contact__email:hover {
  color: var(--pm-contact-white);
}

.pm-contact__email:focus-visible,
.pm-contact__social:focus-visible {
  outline: 2px solid var(--pm-contact-orange);
  outline-offset: 5px;
}

/* Social links */
.pm-contact__socials {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.pm-contact__social {
  align-items: center;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: var(--pm-contact-white);
  display: inline-flex;
  font-family: var(--pm-contact-body-font);
  font-size: 0.95rem;
  font-weight: 700;
  justify-content: center;
  min-height: 44px;
  padding: 9px 16px;
  text-decoration: none;
  transition: background-color 180ms ease,
              border-color 180ms ease,
              color 180ms ease;
}

.pm-contact__social:hover {
  background: var(--pm-contact-orange);
  border-color: var(--pm-contact-orange);
  color: var(--pm-contact-white);
}

/* Division affiliation */
.pm-contact__affiliation {
  color: rgba(255, 255, 255, 0.72);
  font-family: var(--pm-contact-body-font);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
  margin: 26px 0 0;
}

/* Research Council identity */
.pm-contact__council {
  align-items: baseline;
  color: var(--pm-contact-white);
  display: flex;
  flex-wrap: wrap;
  font-family: var(--pm-contact-body-font);
  font-size: clamp(1.5rem, 3.2vw, 2.25rem);
  font-weight: 800;
  gap: 0.35em;
  justify-content: center;
  line-height: 1.3;
  margin: 34px 0 0;
  text-align: center;
}

.pm-contact__council-main {
  color: var(--pm-contact-white);
}

.pm-contact__council-sub {
  color: var(--pm-contact-orange);
}

/* Small-screen refinements */
@media (max-width: 600px) {
  .pm-contact__container {
    width: calc(100% - 32px);
  }

  .pm-contact__email {
    font-size: clamp(1.5rem, 7vw, 2.3rem);
  }

  .pm-contact__council {
    align-items: center;
    flex-direction: column;
    gap: 2px;
    font-size: clamp(1.45rem, 6vw, 2rem);
  }
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
  .pm-contact__email,
  .pm-contact__social {
    transition: none;
  }
}



/* =========================================================
   ALIGNMENT VARIANTS
   ========================================================= */

/* Main website: contact content centred */
.pm-contact--center {
  text-align: center;
}

.pm-contact--center .pm-contact__description {
  margin-inline: auto;
}

.pm-contact--center .pm-contact__socials {
  justify-content: center;
}

/* Subdomains: contact content aligned left */
.pm-contact--left {
  text-align: left;
}

.pm-contact--left .pm-contact__description {
  margin-inline: 0;
}

.pm-contact--left .pm-contact__socials {
  justify-content: flex-start;
}

/* The Council heading stays centred on EVERY website */
.pm-contact--left .pm-contact__council,
.pm-contact--center .pm-contact__council {
  justify-content: center;
  text-align: center;
}

/* Mobile: preserve the selected alignment */
@media (max-width: 600px) {
  .pm-contact--center .pm-contact__socials {
    justify-content: center;
  }

  .pm-contact--left .pm-contact__socials {
    justify-content: flex-start;
  }
}


        /* =====================================================================
           RESPONSIVE / MOBILE  (desktop-first, one block per breakpoint)
           1024 tablet · 920 nav collapses · 720/680 phones · 480 small · 380 tiny · landscape phones
           ===================================================================== */

        /* Always-on safety rules */
        img,video{max-width:100%;height:auto}
        .card,.feature-card,.project-card,.team-card,.toolkit-card,.info-card,.objective-card,.scope-card{min-width:0}
        p,h1,h2,h3,h4{overflow-wrap:break-word}
        table{display:block;overflow-x:auto}

        @media (max-width:1024px){
          html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
          .container{width:calc(100% - 40px)}
          .section{padding:80px 0}
          .section-title{font-size:clamp(2rem,5.6vw,3rem)}
          .hero{min-height:auto;padding:120px 0 70px}
          .hero-content{max-width:100%;text-align:center}
          .hero h1,.hero h2{font-size:clamp(2.4rem,8vw,4.2rem);line-height:1.08}
          .hero p{font-size:1rem;margin-inline:auto}
          .button-row{justify-content:center}
          .stats-grid{grid-template-columns:repeat(2,1fr)}
          .grid,.cards,.features,.timeline,.project-grid,.team-grid,.toolkit-grid{grid-template-columns:1fr!important}
        }

        @media (max-width:920px){
          /* --- mobile menu (JS toggles the .open class) --- */
          .menu-toggle{display:inline-flex}
          .menu-toggle span::before,.menu-toggle span::after{transform:none} /* removes doubled offset (top + translate) */
          .site-header.scrolled .menu-toggle{background:rgba(255,255,255,.12)}
          .nav-links{
            position:absolute;top:100%;left:0;right:0;width:auto;
            display:grid;gap:4px;
            padding:12px 20px 20px;
            background:var(--white);
            border-top:1px solid var(--line);
            border-radius:0 0 var(--radius) var(--radius);
            box-shadow:var(--shadow);
            max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px);
            overflow-y:auto;overscroll-behavior:contain;
            opacity:0;visibility:hidden;pointer-events:none;
            transform:translateY(-8px);
            transition:opacity 180ms ease,transform 180ms ease,visibility 0s linear 180ms
          }
          .nav-links.open{
            opacity:1;visibility:visible;pointer-events:auto;transform:none;
            transition:opacity 180ms ease,transform 180ms ease,visibility 0s
          }
          .site-header.scrolled .nav-links{background:var(--navy);border-top-color:rgba(255,255,255,.08)}
          .nav-link{display:flex;justify-content:center;border-radius:8px;min-height:44px;padding:12px}

          /* --- layout --- */
          .split,.toolkit-grid,.hero-layout,.hero-content{grid-template-columns:1fr}
          .hero-layout,.hero-content{gap:40px}
          .hero-copy{text-align:center}
          .hero-logo-panel{display:flex;justify-content:center}
          .hero-logo-frame{max-width:380px}
          .cards-3,.scope-grid,.objectives-grid,.resource-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
          .cards-3>:last-child:nth-child(odd),.scope-grid>:last-child:nth-child(odd){grid-column:1/-1}
          .module-grid,.ecosystem-branches,.stats-grid{grid-template-columns:1fr}
          .ecosystem-branches{border-top:0;margin-top:28px;padding-top:0}
          .ecosystem-branches::before,.nav-divider{display:none}
          .team-card,.team-card:nth-child(4),.team-card:nth-child(5){grid-column:span 3}
          #ca{left:0} /* desktop-only offset; it pushed cards off-screen on phones */
          .footer-grid{grid-template-columns:1fr;justify-items:center;text-align:center}
          .footer-grid .brand{align-items:center}
          .footer-copy,.copyright{text-align:center}
        }

        @media (max-width:720px){
          .projects-section-header{grid-template-columns:1fr}
        }

        @media (max-width:680px){
          html{scroll-padding-top:76px}
          .container{width:calc(100% - 32px)}
          .section{padding:64px 0}
          .section-title{font-size:clamp(1.75rem,8vw,2.4rem)}
          .nav-wrap{min-height:68px;gap:12px}
          .nav-links{max-height:calc(100vh - 72px);max-height:calc(100dvh - 72px)}
          .hero{min-height:100vh;min-height:100svh;padding:104px 0 56px}
          .hero h1,.hero h2{font-size:clamp(2rem,10.5vw,3rem)}
          .hero p{margin-top:22px}
          .button-row,.survey-section .button-row{align-items:stretch;flex-direction:column}
          .btn{width:100%}

          .cards-3,.scope-grid,.objectives-grid,.resource-grid,.module-grid,.team-grid,.associate-row,.toolkit-grid,.split{grid-template-columns:minmax(0,1fr)}
          .cards-3,.scope-grid,.objectives-grid,.resource-grid,.module-grid{margin-top:32px}
          .team-card,.team-card:nth-child(4),.team-card:nth-child(5){grid-column:auto}

          .project-card{margin-top:32px}
          .project-card-header{padding:24px 18px}
          .project-body{padding:22px 18px}
          .project-title{font-size:clamp(1.35rem,6vw,1.8rem)}
          .project-meta-grid{grid-template-columns:1fr 1fr;gap:16px}
          .project-sections{grid-template-columns:1fr}
          .timeline-strip-item{flex-basis:100%}

          .email-link{font-size:clamp(1.1rem,5.6vw,1.8rem)}
          .social-row{justify-content:center}
          .linkedin,.social-btn{min-height:44px;min-width:44px}
          .footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 14px;text-align:center}
          .footer-links a{display:inline-block;padding:8px 0}
          .hero-logo-frame{max-width:280px;border-radius:12px}
          .section-portal-cta-inner{flex-direction:column;align-items:flex-start}
          .section-portal-cta-inner .btn{width:100%}
        }

        @media (max-width:480px){
          .project-meta-grid{grid-template-columns:1fr}
          .info-card,.objective-card,.resource-card,.scope-card{padding:26px 18px}
          .brand-main{font-size:1.2rem}
          .brand-sub{font-size:.66rem;letter-spacing:.1em}
          .lead-copy,.subtitle{font-size:1rem}
          .live-counter{font-size:.92rem}
        }

        @media (max-width:380px){
          .container{width:calc(100% - 24px)}
          .section{padding:56px 0}
          .nav-links{padding:10px 12px 16px}
          .brand-main{font-size:1.1rem}
          .brand-sub{font-size:.6rem;letter-spacing:.06em}
          .menu-toggle{width:42px;height:42px}
          .btn{padding:12px 14px}
          .project-body,.project-card-header{padding-left:14px;padding-right:14px}
          .footer-links{grid-template-columns:1fr 1fr;gap:2px 8px}
        }

        /* Landscape phones: short viewport */
        @media (max-height:480px) and (orientation:landscape){
          html{scroll-padding-top:62px}
          .nav-wrap{min-height:56px}
          .nav-links{max-height:calc(100vh - 58px);max-height:calc(100dvh - 58px)}
          .hero{min-height:auto;padding:84px 0 40px}
          .section{padding:56px 0}
        }
