@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{color-scheme:dark;--bg:#07121d;--surface:#0c1b29;--line:#20313e;--cyan:#66e1d8;--white:#f2f5f6;--muted:#92a6b5;--font:'DM Sans','Segoe UI',sans-serif;--display:'Manrope','Segoe UI',sans-serif;--header-height:80px;--hero-gap:20px;--hero-height:min(790px,calc(100svh - var(--header-height) - var(--hero-gap) - 18px))}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--bg);color:var(--white);font-family:var(--font);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,textarea{font:inherit}button,a,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.45}a:focus-visible,button:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}.ico{width:20px;height:20px;flex-shrink:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.status-dot{display:inline-block;width:6px;height:6px;flex-shrink:0;border-radius:50%;background:var(--cyan);box-shadow:0 0 9px #66e1d833}

/* Navigation stays above the portrait and conversation. */
.site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:24px;justify-content:space-between;height:var(--header-height);min-height:var(--header-height);padding:16px max(28px,calc((100vw - 1440px)/2 + 28px));background:#07121dee;backdrop-filter:blur(20px);border-bottom:1px solid #ffffff0c}.brand{display:flex;align-items:center;gap:12px}.brand-icon{height:41px;width:41px;display:grid;place-content:center;position:relative;border:1px solid #66e1d855;border-radius:12px;font:800 29px var(--display);color:var(--cyan)}.brand-icon>span{position:absolute;bottom:4px;right:4px;color:white;font-size:22px}.brand-copy{display:flex;flex-direction:column;gap:5px}.brand-copy b{font:800 21px/1 var(--display);letter-spacing:-.7px}.brand-copy b>span,.footer-brand span{color:var(--cyan);margin-left:3px}.brand-copy small{font-size:8px;letter-spacing:1.5px;color:var(--muted)}.main-nav{display:flex;align-items:center;gap:6px;padding:5px;background:#ffffff03;border:1px solid #ffffff0b;border-radius:40px}.main-nav a{padding:10px 19px;border-radius:30px;font-size:12px;color:#aab9c5;transition:background .2s,color .2s}.main-nav a:hover,.main-nav a.active{background:#1a2a36;color:white}.nav-cta{display:inline-flex;align-items:center;gap:11px;padding:12px 16px;border:1px solid #4a7f7b;border-radius:8px;font-size:12px;white-space:nowrap}.nav-cta .ico{width:16px;height:16px;margin-left:12px;color:var(--cyan)}.nav-cta:hover{background:#142e34}.menu-btn{display:none;border:1px solid var(--line);border-radius:8px;padding:10px;background:var(--surface);color:white}

/* Keep the chat beside the portrait through tablet and laptop sizes. */
main,.footer{width:min(1440px,100%);margin:0 auto}.hero-layout{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:24px;padding:var(--hero-gap) 28px 0;align-items:stretch}.portrait-panel,.chat-panel{height:var(--hero-height);min-height:0;min-width:0;border-radius:18px;overflow:hidden}.portrait-panel{position:relative;isolation:isolate;background:radial-gradient(ellipse at 45% 30%,#13415c,#0b1b2b 75%)}.portrait{position:absolute;top:44px;left:5%;width:90%;height:calc(100% - 44px);object-fit:contain;object-position:center top;z-index:-2}.portrait-shade{position:absolute;inset:0;background:linear-gradient(180deg,#05121a44 0,transparent 38%,#04121d1a 47%,#04121dd9 76%,#04121d 100%);z-index:-1}.portrait-topline{position:absolute;top:25px;left:27px;right:27px;display:flex;align-items:center;justify-content:space-between;gap:8px}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:600;color:#d0ecec}.orbit-mark{font-size:25px;color:var(--cyan)}.portrait-caption{position:absolute;bottom:28px;left:30px;right:30px}.profile-label{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.3px;color:#b6d9da}.portrait-caption h1{font:800 clamp(30px,3.2vw,49px)/1.14 var(--display);letter-spacing:-2px;margin:16px 0 13px}.portrait-caption h1>span{color:#c5dce7}.role{font-size:12px;color:#c2d1da;letter-spacing:.2px;margin:0}.role>span{padding:0 10px;color:var(--cyan)}.portrait-footer{margin-top:24px;padding-top:19px;border-top:1px solid #ffffff24;display:flex;align-items:center;justify-content:space-between}.portrait-footer>span{font-size:11px;line-height:1.6;color:#99b2c2}.portrait-footer a{width:39px;height:39px;display:grid;place-items:center;border:1px solid #a1c7d14d;border-radius:50%;transition:background .2s}.portrait-footer a:hover{background:#204b55}

.chat-panel{display:flex;flex-direction:column;border:1px solid #2b414e;background:linear-gradient(145deg,#102330,#0c1a26 68%);box-shadow:0 18px 50px #00000019}.chat-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:26px 25px 22px}.chat-brand{display:flex;align-items:center;gap:13px;min-width:0}.chat-icon{width:44px;height:44px;display:grid;place-items:center;flex-shrink:0;border:1px solid #66e1d840;border-radius:13px;background:#66e1d80b;color:var(--cyan)}.chat-icon .ico{width:23px;height:23px}.chat-heading h2{font:700 clamp(15px,1.4vw,20px)/1.35 var(--display);letter-spacing:-.5px;margin:0 0 5px}.chat-heading h2 span{color:var(--cyan);margin-left:3px}.chat-heading p{font-size:11px;color:var(--muted);margin:0}.new-chat{display:grid;place-items:center;width:32px;height:32px;border:1px solid transparent;border-radius:8px;background:transparent;color:#99b0be;flex-shrink:0}.new-chat:hover{background:#ffffff09;border-color:var(--line);color:var(--cyan)}.new-chat .ico{width:18px;height:18px}.chat-context{padding:11px 25px;display:flex;justify-content:space-between;align-items:center;gap:10px;background:#050f1738;border-top:1px solid #ffffff07;border-bottom:1px solid #ffffff07;color:#9ab3c0;font-size:10px}.chat-context>span:first-child{display:flex;align-items:center;gap:7px}.chat-context .status-dot{width:4px;height:4px}.mode-badge{font-size:9px;letter-spacing:.3px;border-radius:5px;padding:4px 7px;white-space:nowrap}.mode-badge.demo{color:#e7c18a;background:#e7c18a12}.mode-badge.api{color:var(--cyan);background:#66e1d80c}.chat-thread{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:19px 24px 24px;scrollbar-width:thin;scrollbar-color:#365363 transparent}.chat-day{text-align:center;margin:6px 0 25px;font-size:8px;color:#6c8797;letter-spacing:2px}.message{display:flex;align-items:flex-end;gap:11px;margin-bottom:17px}.message:last-child{margin-bottom:0}.message.user{justify-content:flex-end}.avatar{display:grid;place-items:center;position:relative;flex-shrink:0;width:31px;height:31px;border:1px solid #66e1d846;border-radius:10px;background:#163640;color:var(--cyan);font:700 15px var(--display)}.avatar>span{position:absolute;right:-3px;bottom:-5px;font-size:12px;color:#d3b579}.bubble{max-width:88%;padding:15px 17px;border:1px solid #ffffff0b;border-radius:14px 14px 14px 3px;background:#172c3a;font-size:12px;line-height:1.85;color:#c5d4de}.bubble p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.bubble p+p{margin-top:11px}.bubble .welcome-title{font:700 16px/1.5 var(--display);letter-spacing:-.4px;color:#f2f6f9}.welcome-title>span{margin-left:3px}.bubble time{display:block;margin-top:7px;text-align:right;font-size:9px;color:#7793a4}.user .bubble{background:#1c494c;border-color:#66e1d829;border-radius:14px 14px 3px 14px;color:#e0f7f2}.user .bubble time{color:#92beba}.loading-message .bubble p:after{content:'';display:inline-block;width:5px;height:5px;margin-left:7px;background:var(--cyan);border-radius:50%;animation:blink 1s infinite}.chat-bottom{padding:18px 24px 19px;border-top:1px solid #ffffff08;background:#0c1b27}.suggestions{margin-bottom:19px}.suggestions.used{display:none}.suggestion-label{display:block;font-size:9px;letter-spacing:.5px;color:#7d98a8;margin-bottom:10px}.suggestion-options{display:flex;gap:7px;flex-wrap:wrap}.suggestions button{display:flex;justify-content:space-between;align-items:center;gap:14px;border:1px solid #2b414e;background:#112530;border-radius:7px;padding:9px 11px;font-size:10px;color:#bdced7;transition:border-color .2s,background .2s}.suggestions button>span{color:var(--cyan);font-size:13px}.suggestions button:hover{background:#1a343e;border-color:#66e1d866}.chat-form{display:flex;align-items:flex-end;gap:10px;border:1px solid #3b5967;border-radius:11px;padding:9px 9px 9px 15px;background:#152a37;transition:border-color .2s,box-shadow .2s}.chat-form:focus-within{border-color:#66e1d8;box-shadow:0 0 0 3px #66e1d80b}.chat-form textarea{flex:1;min-width:0;min-height:37px;max-height:125px;background:transparent;border:0;outline:none;padding:8px 0;resize:none;line-height:21px;color:white;font-size:12px}.chat-form textarea::placeholder{color:#8ca4b4}.send-btn{display:grid;place-items:center;width:37px;height:37px;flex-shrink:0;border:0;border-radius:8px;background:var(--cyan);color:#0d3035;transition:background .2s,transform .2s}.send-btn:hover{background:#98f5e8;transform:translateY(-1px)}.send-btn .ico{width:19px;height:19px}.composer-meta{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:11px;color:#718a9a;font-size:8px}.chat-notice{margin:0;line-height:1.5}.composer-meta>span{flex-shrink:0}.language-dot{padding:0 4px;color:var(--cyan)}

.about-section{display:grid;grid-template-columns:1fr 1fr;gap:clamp(35px,8vw,120px);padding:88px 40px 60px}.section-caption{font-size:9px;font-weight:500;letter-spacing:2px;color:var(--cyan);margin-bottom:20px}.about-copy h2{font:600 clamp(28px,3vw,42px)/1.25 var(--display);letter-spacing:-1.6px;margin:0 0 23px}.about-copy h2>span{color:#8fa7b7}.about-copy>p{max-width:500px;color:#91a7b7;font-size:13px;line-height:1.9}.about-copy strong{font-weight:500;color:#dce5eb}.text-link{display:inline-flex;align-items:center;gap:25px;margin-top:15px;color:var(--cyan);font-size:12px}.text-link .ico{width:15px;height:15px}.expertise h3{font:500 25px/1.35 var(--display);letter-spacing:-.7px;margin:0 0 23px}.skill-grid{display:flex;flex-wrap:wrap;gap:9px;max-width:520px}.skill{padding:10px 13px;border:1px solid #253a48;border-radius:6px;color:#a9bdca;font-size:11px;background:#0c1b26;transition:border-color .2s}.skill:hover{border-color:#66e1d877}.learning-tag{display:flex;align-items:center;gap:8px;margin-top:21px;color:#7f99a9;font-size:10px;line-height:1.6}.learning-tag .status-dot{width:4px;height:4px}.experience-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 40px 55px;padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.experience-strip>div{display:flex;flex-direction:column;gap:9px;padding-left:30px;border-left:1px solid var(--line)}.experience-strip>div:first-child{border:0;padding-left:0}.experience-strip strong{font:500 25px var(--display);letter-spacing:-.6px}.experience-strip strong>span{color:var(--cyan)}.experience-strip div>span{font-size:11px;color:#7f99a9}.footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 40px 28px;font-size:10px;color:#6e889a}.footer-brand{font:800 19px var(--display);color:white}.footer>a:last-child{color:#9bb6c5}.footer>a:last-child>span{color:var(--cyan);margin-left:7px}

@keyframes blink{0%,100%{opacity:1}50%{opacity:.15}}
@media(min-width:1600px){.hero-layout{gap:30px}.chat-heading{padding:30px}.chat-context{padding-left:30px;padding-right:30px}.chat-thread{padding:22px 30px 28px}.chat-bottom{padding:22px 30px}.bubble{font-size:13px}.chat-heading h2{font-size:21px}.suggestions button{font-size:11px}}
@media(max-width:1100px){.site-header{gap:16px;padding:15px 24px}.brand-copy small{font-size:7px;letter-spacing:1px}.main-nav a{padding:10px 13px;font-size:11px}.hero-layout{padding:var(--hero-gap) 24px 0;gap:18px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.portrait-caption{left:23px;right:23px}.portrait-caption h1{font-size:36px}.portrait-topline{left:23px;right:23px}.chat-heading{padding:23px 19px}.chat-heading h2{font-size:16px}.chat-icon{width:37px;height:37px;border-radius:11px}.chat-brand{gap:9px}.chat-heading p{font-size:10px}.chat-context{padding:11px 19px;font-size:9px}.chat-thread{padding:16px 18px 22px}.chat-bottom{padding:17px 18px}.bubble{padding:13px 14px}.suggestion-options{gap:6px}.suggestions button{padding:8px 9px;gap:8px;font-size:9px}.composer-meta{font-size:7px;gap:7px}.about-section{padding:70px 30px 50px;gap:45px}.experience-strip{margin-left:30px;margin-right:30px}.experience-strip strong{font-size:22px}}
@media(max-width:800px){:root{--header-height:70px;--hero-gap:14px}html{scroll-padding-top:90px}.site-header{padding:14px 20px;gap:12px}.brand-copy small{display:none}.brand-icon{width:36px;height:36px;font-size:25px}.brand-icon>span{font-size:19px}.brand-copy b{font-size:20px}.menu-btn{display:grid;place-items:center;flex-shrink:0}.main-nav{display:none;position:absolute;top:calc(var(--header-height) - 1px);left:14px;right:14px;flex-direction:column;align-items:stretch;gap:4px;padding:10px;border-radius:13px;background:#102331;box-shadow:0 15px 30px #0008}.main-nav a{font-size:13px;padding:13px 15px;border-radius:8px}.nav-open .main-nav{display:flex}.nav-cta{margin-left:auto;padding:10px 12px;font-size:11px}.nav-cta .ico{margin-left:3px;width:14px;height:14px}.hero-layout{grid-template-columns:1fr;padding:var(--hero-gap) 20px 0;gap:20px}.chat-panel{order:-1;height:var(--hero-height)}.portrait-panel{height:680px}.portrait{object-position:center top}.portrait-caption h1{font-size:48px}.portrait-caption{left:30px;right:30px;bottom:30px}.portrait-topline{left:30px;right:30px}.chat-heading{padding:23px}.chat-heading h2{font-size:19px}.chat-context{padding-left:23px;padding-right:23px;font-size:10px}.chat-thread{padding:20px 23px 25px}.chat-bottom{padding:19px 23px}.suggestions button{padding:9px 11px;font-size:10px;gap:14px}.bubble{font-size:13px}.composer-meta{font-size:8px}.about-section{padding:55px 27px 40px;gap:40px}.expertise h3{font-size:22px}.experience-strip{margin:0 27px 35px}.experience-strip>div{padding-left:18px}.experience-strip strong{font-size:18px}.experience-strip div>span{font-size:9px}.footer{padding:0 27px 25px}}
@media(max-width:520px){.site-header{padding:13px 16px;gap:10px}.brand{gap:8px}.brand-icon{width:33px;height:33px;font-size:23px;border-radius:9px}.brand-copy b{font-size:18px}.nav-cta{gap:8px;padding:10px;font-size:10px}.nav-cta .status-dot{display:none}.menu-btn{padding:8px}.hero-layout{padding:var(--hero-gap) 12px 0;gap:16px}.chat-panel,.portrait-panel{border-radius:14px}.chat-panel{height:var(--hero-height);min-height:0}.chat-heading{padding:20px 16px}.chat-heading h2{font-size:15px;letter-spacing:-.5px}.chat-heading p{font-size:10px}.chat-icon{width:34px;height:34px;border-radius:10px}.chat-icon .ico{width:19px;height:19px}.chat-brand{gap:10px}.new-chat{width:26px;height:30px}.new-chat .ico{width:16px;height:16px}.chat-context{padding:10px 16px;font-size:9px}.mode-badge{font-size:8px;padding:4px 6px}.chat-thread{padding:17px 14px 22px}.chat-day{font-size:7px;margin-bottom:22px}.message{gap:8px}.avatar{width:27px;height:27px;font-size:13px;border-radius:9px}.bubble{padding:13px;font-size:12px;max-width:89%;line-height:1.8}.bubble .welcome-title{font-size:15px}.chat-bottom{padding:15px 14px}.suggestions{margin-bottom:15px}.suggestion-options{gap:6px}.suggestions button{padding:8px;font-size:9px;gap:9px}.suggestion-label{font-size:8px}.chat-form{padding:7px 7px 7px 12px}.chat-form textarea{font-size:16px;line-height:22px;padding-top:8px;padding-bottom:7px}.composer-meta{font-size:7px;align-items:flex-start}.composer-meta>span{padding-top:1px}.portrait-panel{height:590px}.portrait-caption h1{font-size:40px}.portrait-caption{left:24px;right:24px;bottom:25px}.portrait-topline{left:24px;right:24px}.eyebrow{font-size:8px;letter-spacing:1.6px}.about-section{grid-template-columns:1fr;padding:48px 23px 36px;gap:40px}.about-copy h2{font-size:33px}.about-copy>p{font-size:12px}.expertise h3{font-size:25px}.experience-strip{grid-template-columns:1fr 1fr;margin:0 23px 30px;gap:25px 15px;padding:24px 0}.experience-strip>div{padding-left:16px}.experience-strip>div:nth-child(odd){padding-left:0;border:0}.experience-strip strong{font-size:23px}.experience-strip div>span{font-size:10px}.footer{flex-wrap:wrap;justify-content:space-between;row-gap:18px;padding:0 23px 26px;font-size:9px}.footer>a:last-child{flex-basis:100%;border-top:1px solid var(--line);padding-top:18px}.role{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Keep the composer visible; only the conversation scrolls within the panel. */
.chat-heading, .chat-context, .chat-bottom { flex-shrink: 0; }
@media (max-height: 740px) {
  :root { --header-height: 68px; --hero-gap: 12px; }
  .site-header { padding-top: 10px; padding-bottom: 10px; }
  .chat-heading { padding-top: 15px; padding-bottom: 15px; }
  .chat-context { padding-top: 7px; padding-bottom: 7px; }
  .chat-bottom { padding-top: 12px; padding-bottom: 12px; }
  .suggestions { margin-bottom: 10px; }
  .suggestion-label { display: none; }
  .chat-day { margin: 0 0 14px; }
  .portrait-caption { bottom: 20px; }
  .portrait-caption h1 { font-size: clamp(26px, 3vw, 40px); margin: 10px 0; }
  .portrait-footer { margin-top: 12px; padding-top: 12px; }
}
@media (max-height: 550px) {
  :root { --header-height: 58px; --hero-gap: 10px; }
  .brand-copy small, .chat-heading p, .chat-context, .suggestions, .composer-meta { display: none; }
  .chat-heading { padding-top: 10px; padding-bottom: 10px; }
  .chat-bottom { padding-top: 10px; padding-bottom: 10px; }
  .portrait-topline, .profile-label, .portrait-footer { display: none; }
  .portrait-caption { left: 20px; right: 20px; bottom: 16px; }
  .portrait-caption h1 { font-size: 27px; }
  .portrait { top: 12px; height: calc(100% - 12px); }
}