:root {
  --ink: #102d42;
  --muted: #667783;
  --line: #d9e1e5;
  --canvas: #f1f4f5;
  --surface: #ffffff;
  --soft: #e5f3f3;
  --accent: #119e9f;
  --accent-dark: #075d71;
  --serif: Georgia, 'Times New Roman', serif;
}

* { box-sizing: border-box; margin: 0; }
html { scroll-behavior: smooth; }
body { background: var(--canvas); color: var(--ink); font-family: Manrope, sans-serif; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
.icon { width: 1em; height: 1em; display: inline-block; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; vertical-align: -.12em; }
.container { width: min(1120px, calc(100% - 48px)); margin-inline: auto; }
.page-glow { display: none; }

.site-header { width: min(1220px, calc(100% - 48px)); height: 82px; margin: auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.brand { font-size: 1.3rem; font-weight: 800; letter-spacing: -.08em; }
.brand span, .header-contact .icon, .text-link .icon { color: var(--accent); }
.nav { display: flex; gap: 2.1rem; color: var(--muted); font-size: .8rem; }
.nav a:hover, .header-contact:hover, .text-link:hover { color: var(--accent); }
.header-contact { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; font-weight: 700; }

.hero { min-height: calc(100vh - 82px); display: grid; grid-template-columns: 1.35fr .65fr; gap: 5rem; align-items: center; padding-block: 5rem; }
.eyebrow, .section-label, .project-kicker, .credential-type { color: var(--muted); text-transform: uppercase; font: 500 .68rem 'DM Mono', monospace; letter-spacing: .1em; }
.eyebrow { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.35rem; color: var(--accent-dark); }
.eyebrow span, .status span { width: 7px; height: 7px; display: inline-block; border-radius: 50%; background: var(--accent); }
.hero h1 { max-width: 730px; font-size: clamp(3rem, 6.5vw, 6rem); line-height: .98; letter-spacing: -.075em; }
.hero h1 em { color: var(--accent); font-family: var(--serif); font-weight: 400; }
.hero-intro { max-width: 560px; margin-top: 2rem; color: var(--muted); font-size: 1.04rem; }
.hero-actions { display: flex; align-items: center; gap: 1.8rem; margin-top: 2.4rem; }
.button { display: inline-flex; align-items: center; gap: 1.5rem; padding: .9rem 1.15rem; font-size: .8rem; font-weight: 700; transition: transform .2s, box-shadow .2s; }.button .icon { width: 1.05rem; height: 1.05rem; }
.button-primary { background: var(--accent); color: white; border-radius: 4px; }
.button-primary:hover { background: var(--accent-dark); transform: translateY(-2px); box-shadow: 0 10px 18px rgba(17, 158, 159, .18); }
.text-link { display: inline-flex; align-items: center; gap: .35rem; color: var(--accent-dark); font-size: .82rem; font-weight: 700; transition: color .2s; }

.hero-card { min-height: 345px; padding: 1.5rem; display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 28px rgba(16, 45, 66, .05); }
.profile-frame { width: 116px; height: 116px; overflow: hidden; border: 4px solid var(--soft); border-radius: 50%; box-shadow: 0 6px 18px rgba(16, 45, 66, .1); }
.profile-photo { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; transform: scale(1.7); transform-origin: center 63%; }
.status { display: flex; align-items: center; gap: .55rem; margin-top: auto; color: var(--muted); font: 400 .66rem 'DM Mono', monospace; }
.hero-card-rule { margin: 1rem 0; border-top: 1px solid var(--line); }
.hero-card > p { font-size: 1.02rem; line-height: 1.4; }
.hero-socials { display: flex; gap: 1rem; margin-top: 1.4rem; color: var(--muted); font: 400 .68rem 'DM Mono', monospace; }.hero-socials a { display: inline-flex; align-items: center; gap: .2rem; }.hero-socials .icon { width: .75rem; height: .75rem; }
.hero-socials a:hover { color: var(--accent); }

.section { padding-block: 7rem; border-top: 1px solid var(--line); }
.section-label { margin-bottom: 2.2rem; }
.about-content { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; }
.about h2, .contact-band h2, .project-copy h2 { letter-spacing: -.055em; line-height: 1.1; }
.about h2 { font-size: clamp(2rem, 3.7vw, 3.25rem); }
.about-body > p { color: var(--muted); }
.quick-facts { margin-top: 2.4rem; border-top: 1px solid var(--line); }
.quick-facts div { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid var(--line); font-size: .78rem; }
.quick-facts dt { color: var(--muted); }.quick-facts a:hover { color: var(--accent); }

.capability-grid { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--surface); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.capability { min-height: 225px; padding: 1.3rem; display: flex; flex-direction: column; border-right: 1px solid var(--line); transition: background .2s; }
.capability:last-child { border: 0; }.capability:hover { background: #f4fafb; }
.capability-no { color: var(--accent); font: 400 .7rem 'DM Mono', monospace; }
.capability h3 { margin-top: auto; font-size: 1.05rem; letter-spacing: -.04em; }.capability p { margin-top: .55rem; color: var(--muted); font-size: .78rem; }

.timeline { border-top: 1px solid var(--line); }
.timeline article { display: grid; grid-template-columns: 220px 1fr; gap: 2rem; padding: 1.65rem 0; border-bottom: 1px solid var(--line); }
.timeline-date, .timeline-type { font: 400 .68rem 'DM Mono', monospace; color: var(--muted); }
.timeline-type { color: var(--accent); text-transform: uppercase; letter-spacing: .08em; }
.timeline h3 { margin: .35rem 0 .55rem; font-size: 1.1rem; letter-spacing: -.035em; }
.timeline div > p:last-child { max-width: 600px; color: var(--muted); font-size: .84rem; }

.section-heading { display: flex; align-items: flex-start; justify-content: space-between; }.section-heading > p:last-child { max-width: 270px; color: var(--muted); font-size: .8rem; }
.project { display: grid; grid-template-columns: 1fr 1fr; margin-top: 2rem; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.project-visual { position: relative; min-height: 400px; padding: 1.5rem; overflow: hidden; isolation: isolate; background: radial-gradient(circle at 78% 22%, rgba(255, 255, 255, .72), transparent 33%), linear-gradient(135deg, #d5ebed, #edf7f7); }.project-number { position: relative; z-index: 2; color: var(--accent); font: 400 .75rem 'DM Mono', monospace; }
.queue-lines { position: absolute; inset: 25% 11%; display: grid; gap: 14px; transform: rotate(-10deg); }.queue-lines i { border: 1px solid rgba(57, 115, 91, .35); background: rgba(255, 255, 255, .38); }.queue-lines i:nth-child(2) { margin-left: 13%; }.queue-lines i:nth-child(3) { margin-left: 26%; }.queue-lines i:nth-child(4) { margin-left: 39%; }
.taboor-logos { position: absolute; inset: 3.5rem 2rem 3.5rem; display: grid; place-items: center; }
.taboor-logos img { position: relative; z-index: 1; display: block; width: min(380px, 112%); height: auto; filter: brightness(1.26) contrast(1.13) saturate(.9); mix-blend-mode: multiply; }
.taboor-orbit { position: absolute; border: 1px solid rgba(17, 158, 159, .22); border-radius: 50%; }.orbit-one { width: 260px; height: 260px; }.orbit-two { width: 355px; height: 355px; border-style: dashed; opacity: .45; }
.project-tag { position: absolute; bottom: 1.4rem; left: 1.5rem; color: var(--muted); text-transform: uppercase; font: 400 .65rem 'DM Mono', monospace; letter-spacing: .08em; }
.project-copy { padding: 3rem; }.project-copy h2 { margin: .6rem 0 1.5rem; font-size: 3.7rem; }.project-description { color: var(--muted); }.project-results { margin: 2rem 0; list-style: none; }.project-results li { position: relative; padding: .65rem 0 .65rem 1.1rem; border-top: 1px solid var(--line); font-size: .8rem; }.project-results li:last-child { border-bottom: 1px solid var(--line); }.project-results li::before { position: absolute; left: 0; content: '·'; color: var(--accent); font-size: 1.2rem; line-height: .8; }.project-results strong { color: var(--accent-dark); }

.credential-list { border-top: 1px solid var(--line); }.credential-list article { display: grid; grid-template-columns: 1fr 220px 20px; gap: 2rem; align-items: center; padding: 1.4rem 0; border-bottom: 1px solid var(--line); transition: padding .2s, background .2s; }.credential-list article:hover { padding-inline: 1rem; background: var(--surface); }.credential-list h3 { margin-top: .25rem; font-size: 1rem; letter-spacing: -.03em; }.credential-meta { color: var(--muted); font: .68rem/1.7 'DM Mono', monospace; }.credential-arrow { width: 1.2rem; height: 1.2rem; color: var(--accent); }

.contact-band { min-height: 320px; margin-top: 1rem; margin-bottom: 4rem; padding: 4rem; display: flex; flex-direction: column; align-items: flex-start; color: var(--ink); background: #dceef0; border-radius: 10px; }.contact-band .section-label { margin-bottom: auto; color: var(--accent-dark); }.contact-band h2 { max-width: 700px; font-size: clamp(2rem, 4vw, 3.7rem); }.contact-band > a { display: inline-flex; align-items: center; gap: .35rem; margin-top: 1.5rem; color: var(--accent-dark); border-bottom: 1px solid #92c3c8; font-size: 1rem; font-weight: 800; }.contact-band > a:hover { color: var(--accent); }
.footer { display: flex; justify-content: space-between; padding: 1.5rem 0 2rem; border-top: 1px solid var(--line); color: var(--muted); font: 400 .65rem 'DM Mono', monospace; }
.reveal { animation: rise .7s both; } @keyframes rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

@media (max-width: 760px) { .container, .site-header { width: min(100% - 32px, 1120px); }.site-header { height: 68px; }.nav { display: none; }.hero { grid-template-columns: 1fr; gap: 3rem; padding-block: 4rem; }.hero-card { min-height: 250px; }.section { padding-block: 5rem; }.about-content, .project { grid-template-columns: 1fr; gap: 2.5rem; }.capability-grid { grid-template-columns: 1fr 1fr; }.capability:nth-child(2) { border: 0; }.capability:nth-child(3) { border-top: 1px solid var(--line); }.capability:nth-child(4) { border-top: 1px solid var(--line); border-right: 0; }.timeline article { grid-template-columns: 1fr; gap: .45rem; }.project-visual { min-height: 260px; }.taboor-logos { inset: 2rem 1.5rem; }.taboor-logos img { width: min(340px, 118%); }.orbit-one { width: 205px; height: 205px; }.orbit-two { width: 290px; height: 290px; }.project-copy { padding: 2rem; }.credential-list article { grid-template-columns: 1fr 18px; gap: 1rem; }.credential-meta { grid-column: 1; }.credential-arrow { grid-column: 2; grid-row: 1; }.contact-band { min-height: 280px; padding: 2rem; }.section-heading { display: block; }.section-heading > p:last-child { margin-top: -1rem; margin-bottom: 2rem; }.footer { gap: 1rem; } }
@media (max-width: 420px) { .capability-grid { grid-template-columns: 1fr; }.capability, .capability:nth-child(2), .capability:nth-child(4) { border-right: 0; border-bottom: 1px solid var(--line); }.capability:last-child { border-bottom: 0; }.hero h1 { font-size: 3.05rem; }.hero-actions { flex-direction: column; align-items: flex-start; gap: 1.2rem; } }