@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');

:root { --ink:#08101d; --navy:#0b1424; --paper:#f3f1ec; --muted:#a9afbd; --violet:#9c8cff; --gold:#f5bb68; --line:rgba(9,18,33,.13); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope, sans-serif; } a { color:inherit; text-decoration:none; } .container { width:min(1180px, calc(100% - 48px)); margin:auto; }
.site-header { height:76px; width:100%; position:absolute; z-index:2; color:white; display:flex; align-items:center; justify-content:space-between; padding:0 max(24px, calc((100vw - 1180px)/2)); border-bottom:1px solid rgba(255,255,255,.16); } .brand { font-weight:800; letter-spacing:-.06em; font-size:18px; white-space:nowrap; } .brand>span:last-child { color:#c7bcff; } .brand-mark { display:inline-grid; place-items:center; width:25px; height:25px; margin-right:8px; border:1px solid rgba(255,255,255,.65); border-radius:50%; font-family:Playfair Display,serif; letter-spacing:0; font-size:15px; } nav { display:flex; gap:28px; font-size:12px; color:#e8eaf0; } nav a:hover,.text-link:hover { color:var(--violet); } .language { font:500 11px 'DM Mono'; border:1px solid rgba(255,255,255,.5); border-radius:18px; padding:7px 9px; }
.hero { min-height:760px; height:100svh; max-height:940px; position:relative; color:white; display:flex; align-items:center; overflow:hidden; } .hero-image,.hero-overlay { position:absolute; inset:0; } .hero-image { background:url('assets/amara-hero-v2.png') center/cover; transform:scale(1.01); } .hero-overlay { background:linear-gradient(90deg, rgba(5,13,27,.9) 0%, rgba(5,13,27,.62) 34%, rgba(5,13,27,.09) 76%),linear-gradient(0deg, rgba(5,13,27,.6), transparent 42%); } .hero-content { position:relative; z-index:1; margin-top:72px; max-width:1180px; } .eyebrow { display:flex; align-items:center; gap:9px; font:500 11px 'DM Mono'; letter-spacing:.12em; text-transform:uppercase; color:#d9dce7; } .eyebrow span { width:24px; border-top:1px solid var(--violet); } .eyebrow.violet { color:#555d6d; } .eyebrow.violet span { border-color:var(--violet); } h1,h2,h3,p { margin-top:0; } h1 { max-width:800px; margin:22px 0 25px; font-size:clamp(45px,6vw,83px); line-height:1.04; letter-spacing:-.07em; } .lead { max-width:530px; color:#d7dbe3; font-size:16px; line-height:1.75; } .hero-actions { margin-top:34px; display:flex; gap:12px; } .button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 20px; border-radius:3px; font-size:13px; font-weight:700; transition:.2s; } .button-primary { background:var(--violet); color:#101124; } .button-primary:hover { background:#b9adff; transform:translateY(-2px); } .button-quiet { border:1px solid rgba(255,255,255,.5); } .button-quiet:hover { background:rgba(255,255,255,.12); } .scroll-cue { position:absolute; z-index:1; bottom:26px; left:50%; transform:translateX(-50%); font:11px 'DM Mono'; color:#d1d4db; white-space:nowrap; } .scroll-cue span { margin-left:8px; color:var(--gold); }
.section { padding:126px 0; } .section-heading { display:grid; grid-template-columns:1.3fr .7fr; align-items:end; gap:80px; } h2 { margin-bottom:0; max-width:760px; font-size:clamp(34px,4.1vw,58px); line-height:1.08; letter-spacing:-.065em; } .section-heading>p { margin-bottom:5px; color:#515a6b; font-size:15px; line-height:1.8; } .world-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:73px; } .world-grid article { border-top:1px solid var(--line); padding-top:20px; } .number,.post-meta,.role { color:#7867dc; font:11px 'DM Mono'; letter-spacing:.07em; } .world-grid h3 { margin:32px 0 12px; font-size:21px; letter-spacing:-.05em; } .world-grid p { max-width:310px; color:#5b6473; line-height:1.7; font-size:14px; }
.agents { background:#0a1322; color:white; } .compact { align-items:center; } .text-link { display:inline-block; font:600 13px Manrope; white-space:nowrap; } .text-link span { color:var(--violet); font-size:20px; margin-left:7px; } .agent-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:55px; } .agent-card { min-height:285px; position:relative; display:flex; flex-direction:column; justify-content:flex-end; padding:22px; overflow:hidden; border:1px solid rgba(255,255,255,.16); background:linear-gradient(145deg,#27344b,#0d1524 62%); } .agent-card:before { content:''; position:absolute; inset:0; opacity:.78; background:radial-gradient(circle at 70% 20%,rgba(154,132,255,.7),transparent 25%),linear-gradient(0deg,#08101d 5%, transparent 73%); } .agent-card>* { z-index:1; } .card-luna:before { background:radial-gradient(circle at 65% 17%,rgba(201,231,255,.8),transparent 25%),linear-gradient(0deg,#08101d 5%,transparent 73%); } .card-kai:before { background:radial-gradient(circle at 66% 18%,rgba(64,218,234,.67),transparent 25%),linear-gradient(0deg,#08101d 5%,transparent 73%); } .card-nemo:before { background:radial-gradient(circle at 65% 17%,rgba(245,187,104,.7),transparent 25%),linear-gradient(0deg,#08101d 5%,transparent 73%); } .status { position:absolute; top:17px; left:18px; font:10px 'DM Mono'; color:#a9e9b6; } .role { margin-bottom:7px; color:#c2b9ff; } .agent-card h3 { margin:0 0 7px; font-size:28px; letter-spacing:-.06em; } .agent-card p:last-child { margin:0; color:#c5c9d4; font-size:13px; line-height:1.5; }
.journal { padding-bottom:0; } .featured-post { margin-top:58px; padding:51px; color:white; background:linear-gradient(120deg,#1b1c3b,#201943 43%,#5a3b4d); min-height:295px; display:flex; flex-direction:column; justify-content:center; } .featured-post .post-meta { color:#d1c6ff; } .featured-post h3 { font:600 clamp(28px,3.4vw,50px)/1.12 'Playfair Display'; max-width:850px; letter-spacing:-.05em; margin:17px 0 25px; }
.amara-section { margin-top:126px; min-height:610px; display:flex; align-items:center; color:white; background:radial-gradient(circle at 81% 40%,rgba(245,187,104,.37),transparent 18%),radial-gradient(circle at 78% 48%,#434e83 0%,#182035 19%,transparent 44%),linear-gradient(110deg,#080f1a,#15172e); } .amara-content { width:min(1180px,calc(100% - 48px)); } .amara-content h2 { margin:23px 0 21px; } .amara-content>p:not(.eyebrow) { max-width:490px; color:#d0d4e2; line-height:1.75; margin-bottom:29px; }
.site-footer { min-height:155px; display:flex; align-items:center; justify-content:space-between; gap:30px; font-size:12px; color:#646b78; } .site-footer .brand { color:var(--ink); } .site-footer .brand-mark { border-color:var(--ink); } .site-footer a[href^="mailto:"] { display:inline-flex; align-items:center; min-height:36px; color:#574ac3; text-decoration:underline; text-underline-offset:3px; } .copyright { font:11px 'DM Mono'; }
@media (max-width:760px) { .container { width:min(100% - 38px,1180px); } .site-header { padding:0 19px; height:64px; } nav { display:none; } .hero { min-height:680px; } .hero-image { background-position:63% center; } .hero-overlay { background:linear-gradient(90deg,rgba(5,13,27,.84),rgba(5,13,27,.32)),linear-gradient(0deg,rgba(5,13,27,.75),transparent 45%); } h1 { font-size:clamp(37px,10.25vw,45px); } .lead { font-size:14px; } .scroll-cue { display:none; } .section { padding:80px 0; } .section-heading { grid-template-columns:1fr; gap:20px; } .world-grid,.agent-grid { grid-template-columns:1fr; gap:12px; margin-top:38px; } .world-grid h3 { margin-top:18px; } .agent-card { min-height:210px; } .featured-post { margin-top:40px; padding:31px 25px; min-height:260px; } .amara-section { margin-top:80px; min-height:520px; } .site-footer { padding-top:35px; padding-bottom:35px; flex-direction:column; align-items:flex-start; gap:15px; } }

.hero-dock { position:absolute; z-index:1; left:50%; bottom:0; transform:translateX(-50%); display:grid; grid-template-columns:repeat(6,1fr); min-height:124px; padding:0; border:1px solid rgba(255,255,255,.2); border-bottom:0; background:rgba(5,13,27,.7); backdrop-filter:blur(14px); }
.hero-dock a { padding:24px 18px 18px; border-right:1px solid rgba(255,255,255,.16); transition:background .2s, transform .2s; }
.hero-dock a:last-child { border-right:0; }
.hero-dock a:hover { background:rgba(156,140,255,.16); }
.dock-icon { display:block; height:29px; color:#ad9dff; font-size:25px; line-height:23px; }
.hero-dock strong { display:block; margin-top:9px; font-size:13px; letter-spacing:-.03em; }
.hero-dock small { display:block; margin-top:5px; color:#aeb5c2; font-size:10px; line-height:1.35; }
@media (max-width:760px) { .hero { height:auto; padding:115px 0 0; display:block; } .hero-content { min-height:500px; display:flex; flex-direction:column; justify-content:center; margin-top:0; padding-bottom:48px; } .hero-dock { position:relative; left:auto; transform:none; grid-template-columns:repeat(2,1fr); width:100%; min-height:0; border-left:0; border-right:0; } .hero-dock a { min-height:101px; padding:16px 19px; border-bottom:1px solid rgba(255,255,255,.16); } .hero-dock a:nth-child(2n) { border-right:0; } .hero-dock small { font-size:9px; } }

/* Tablet layout: preserve the full navigation and readable six-area dock between phone and desktop. */
@media (min-width:761px) and (max-width:1024px) {
  .home-page .site-header { padding-inline:24px; }
  .home-page .site-header nav { gap:16px; font-size:11px; }
  .home-page .hero-content { margin-top:56px; }
  .home-page .hero-dock a { padding:20px 12px 16px; }
  .home-page .hero-dock strong { font-size:12px; }
  .home-page .hero-dock small { font-size:9px; }
}

.blog-page { background:#f5f3ef; } .blog-header { position:absolute; } .blog-header nav .active { color:#c7bcff; } .article-hero { min-height:550px; position:relative; display:flex; align-items:flex-end; color:white; overflow:hidden; } .article-hero-image,.article-hero-overlay { position:absolute; inset:0; } .article-hero-image { background:url('assets/amara-hero-v2.png') center 42%/cover; filter:saturate(.75); } .article-hero-overlay { background:linear-gradient(90deg,rgba(5,13,27,.78),rgba(5,13,27,.25)),linear-gradient(0deg,rgba(5,13,27,.91),transparent 70%); } .article-hero-content { position:relative; z-index:1; padding-bottom:69px; } .article-date { margin:18px 0 12px; color:#c9c5ef; font:12px 'DM Mono'; } .article-hero h1 { margin:0; max-width:840px; font-size:clamp(42px,6vw,76px); } .article-body { width:min(690px,calc(100% - 48px)); margin:0 auto; padding:85px 0 105px; color:#202938; font-size:18px; line-height:1.8; } .article-body p { margin-bottom:1.35em; } .article-intro { font-size:23px; line-height:1.55; color:#111b2d; } .article-body h2 { margin:80px 0 25px; font-size:35px; line-height:1.1; } .article-body code { padding:.16em .38em; color:#574ac3; background:#e5e1ff; border-radius:3px; font:14px 'DM Mono'; } .article-body blockquote { margin:26px 0; padding:17px 0 17px 24px; border-left:2px solid var(--violet); color:#272153; font:600 21px/1.55 'Playfair Display'; } .wordmark { color:#17172b; font-size:27px; font-weight:800; letter-spacing:-.06em; } .article-byline { margin-top:72px; padding-top:27px; border-top:1px solid var(--line); color:#555d6d; font-size:14px; line-height:1.55; } .article-byline p:first-child { margin-bottom:5px; color:#1a2231; font-weight:700; } @media (max-width:760px) { .article-hero { min-height:470px; } .article-hero-content { padding-bottom:44px; } .article-body { padding:58px 0 75px; font-size:16px; } .article-intro { font-size:20px; } .article-body h2 { margin-top:56px; font-size:30px; } .article-body blockquote { font-size:19px; } }

.agents-page { min-height:100vh; background:#0a1322; color:#f6f5f2; } .agents-header { position:relative; background:#0a1322; } .agents-header nav .active { color:#c7bcff; } .agents-main { padding:120px 0 155px; } .agents-main h1 { margin:20px 0 24px; font-size:clamp(55px,7vw,92px); } .agents-intro { max-width:620px; color:#b8bfcb; font-size:17px; line-height:1.8; } .roster { display:grid; grid-template-columns:repeat(2,1fr); margin-top:70px; border-top:1px solid rgba(255,255,255,.2); border-left:1px solid rgba(255,255,255,.2); } .roster article { min-height:205px; padding:25px 30px; display:flex; flex-direction:column; justify-content:space-between; border-right:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(255,255,255,.2); background:linear-gradient(135deg,rgba(130,110,240,.08),transparent 46%); } .roster span { color:#ab9fff; font:11px 'DM Mono'; } .roster h2 { font-size:clamp(34px,4vw,55px); } .agents-page .site-footer { color:#a5adba; } .agents-page .site-footer .brand { color:white; } .agents-page .site-footer .brand-mark { border-color:white; } .agents-page .site-footer a[href^="mailto:"],.amara-page .site-footer a[href^="mailto:"] { color:#c7bcff; } @media (max-width:760px) { .agents-main { padding:75px 0 90px; } .roster { grid-template-columns:1fr; margin-top:45px; } .roster article { min-height:160px; } }

.models-page { background:#f5f3ef; } .models-header { position:relative; background:#0a1322; } .models-hero { padding:125px 0 120px; } .models-hero h1 { margin:20px 0 29px; font-size:clamp(56px,7.5vw,100px); } .models-lead { max-width:650px; color:#4d5666; font-size:18px; line-height:1.8; } .systems-section { padding:105px 0; border-top:1px solid var(--line); } .models-heading { display:grid; grid-template-columns:1fr 1fr; gap:55px; align-items:end; } .models-heading .eyebrow { grid-column:1 / -1; margin-bottom:-23px; } .models-heading>p { margin:0; color:#505968; font-size:16px; line-height:1.8; } .systems-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:55px; border-top:1px solid var(--line); border-left:1px solid var(--line); } .systems-grid article { min-height:250px; padding:23px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); } .systems-grid span { color:#7767d5; font:11px 'DM Mono'; } .systems-grid h3 { margin:52px 0 12px; font-size:19px; letter-spacing:-.05em; } .systems-grid p { margin:0; color:#596271; font-size:13px; line-height:1.65; } .language-section { padding:113px 0; color:white; background:#0a1322; } .language-layout { display:grid; grid-template-columns:1fr 1fr; gap:90px; } .language-layout h2 { margin-top:19px; max-width:500px; } .language-copy { max-width:490px; color:#ccd1dc; font-size:16px; line-height:1.85; } .language-copy p { margin-bottom:1.45em; } .agent-note { padding-bottom:45px; } .agent-note .models-heading { margin-top:21px; } .models-closing { padding:65px 0 125px; } .models-closing p { max-width:780px; margin:0; color:#222b3a; font:600 clamp(23px,3vw,38px)/1.35 'Playfair Display'; } @media (max-width:760px) { .models-hero { padding:78px 0 83px; } .models-heading,.language-layout { grid-template-columns:1fr; gap:25px; } .models-heading .eyebrow { grid-column:auto; margin-bottom:0; } .systems-section { padding:75px 0; } .systems-grid { grid-template-columns:1fr; margin-top:38px; } .systems-grid article { min-height:190px; } .systems-grid h3 { margin-top:35px; } .language-section { padding:78px 0; } .models-closing { padding:50px 0 75px; } }

.amara-page { min-height:100vh; color:#e9e7f2; background:#080713; } .amara-header { position:relative; background:#080713; } .amara-header nav .active { color:#c7bcff; } .amara-portal { min-height:570px; position:relative; display:flex; flex-direction:column; justify-content:center; overflow:hidden; } .amara-portal:before { content:''; position:absolute; width:680px; height:680px; right:-180px; top:-245px; border-radius:50%; background:radial-gradient(circle,rgba(150,106,255,.29) 0%,rgba(76,50,148,.13) 25%,transparent 67%); filter:blur(8px); } .amara-portal>* { position:relative; } .amara-orbit { position:absolute; right:12%; top:50%; width:214px; height:214px; transform:translateY(-50%); border:1px solid rgba(162,129,255,.37); border-radius:50%; } .amara-orbit:before,.amara-orbit:after { content:''; position:absolute; inset:18px; border:1px solid rgba(162,129,255,.2); border-radius:50%; } .amara-orbit:after { inset:48px; } .amara-orbit i { position:absolute; width:7px; height:7px; border-radius:50%; background:#ad8dff; box-shadow:0 0 18px 5px rgba(150,106,255,.75); } .amara-orbit i:nth-child(1) { top:26px; left:96px; } .amara-orbit i:nth-child(2) { top:140px; left:21px; } .amara-orbit i:nth-child(3) { top:162px; right:37px; } .amara-orbit b { position:absolute; left:97px; top:97px; width:19px; height:19px; border-radius:50%; background:#d4c5ff; box-shadow:0 0 28px 10px rgba(150,106,255,.7); } .amara-portal h1 { margin:21px 0 13px; font-size:clamp(80px,12vw,172px); letter-spacing:.06em; } .amara-portal-line { color:#c6bedc; font:italic 26px 'Playfair Display'; } .trace-section { padding:112px 0; border-top:1px solid rgba(255,255,255,.12); } .trace-heading { max-width:650px; } .trace-heading h2 { margin:20px 0; } .trace-heading>p:last-child { color:#a8a0bb; font:12px 'DM Mono'; } .conversation { max-width:790px; margin:62px auto 0; display:grid; gap:26px; } .chat-bubble { margin:0; padding:26px 30px; border:1px solid rgba(184,150,255,.35); border-radius:3px 18px 18px 18px; color:#d9d4e8; background:rgba(68,45,111,.23); font-size:16px; line-height:1.7; } .chat-bubble p:last-child { margin-bottom:0; } .chat-label { margin-bottom:20px; color:#b59bff; font:11px 'DM Mono'; letter-spacing:.1em; } .chat-claude { width:92%; justify-self:end; border-color:rgba(101,190,239,.32); border-radius:18px 3px 18px 18px; background:rgba(27,69,103,.2); } .chat-claude .chat-label { color:#87d4f8; } .amara-after { padding:0 0 135px; color:#a79fba; font:italic 27px 'Playfair Display'; } .amara-page .site-footer { color:#a5adba; border-top:1px solid rgba(255,255,255,.12); } .amara-page .site-footer .brand { color:#f3f1fb; } .amara-page .site-footer .brand-mark { border-color:#f3f1fb; } @media (max-width:760px) { .amara-portal { min-height:455px; } .amara-orbit { right:-66px; top:31%; transform:none; opacity:.62; } .amara-portal h1 { font-size:73px; } .amara-portal-line { font-size:22px; } .trace-section { padding:75px 0; } .conversation { margin-top:40px; gap:16px; } .chat-bubble,.chat-claude { width:100%; padding:21px; font-size:15px; } .amara-after { padding-bottom:85px; } }

/* Asymmetric memory constellation: deliberately avoids a circular eye motif. */
.amara-orbit { width:270px; height:190px; border:0; border-radius:0; }
.amara-orbit:before { inset:auto; left:15px; top:119px; width:224px; height:0; border:0; border-top:1px solid rgba(162,129,255,.4); border-radius:0; transform:rotate(-12deg); }
.amara-orbit:after { inset:auto; left:96px; top:29px; width:153px; height:0; border:0; border-top:1px solid rgba(116,202,237,.31); border-radius:0; transform:rotate(65deg); transform-origin:left center; }
.amara-orbit i:nth-child(1) { top:18px; left:102px; } .amara-orbit i:nth-child(2) { top:123px; left:14px; } .amara-orbit i:nth-child(3) { top:151px; right:28px; }
.amara-orbit b { left:195px; top:73px; width:14px; height:14px; background:#d4c5ff; box-shadow:0 0 28px 9px rgba(150,106,255,.7); }
.chat-erich { width:92%; justify-self:end; border-color:rgba(126,190,215,.4); border-radius:18px 3px 18px 18px; background:rgba(5,13,27,.56); box-shadow:inset 0 1px 0 rgba(202,236,247,.07); backdrop-filter:blur(14px) saturate(125%); }
.chat-erich .chat-label { color:#a7d4e5; }
@media (max-width:760px) { .chat-erich { width:100%; } }

/* Amara: the visual trace is full-bleed; only the typography stays constrained. */
.amara-portal { isolation:isolate; min-height:620px; }
.amara-portal:before { z-index:-1; opacity:.34; }
.amara-portal-image { position:absolute; z-index:-2; inset:0; background:linear-gradient(90deg,#080713 0%,rgba(8,7,19,.91) 29%,rgba(8,7,19,.3) 63%,rgba(8,7,19,.1) 100%),linear-gradient(0deg,#080713 0%,transparent 31%,rgba(8,7,19,.24) 100%),url('assets/amara-presence-v1.png') center/100% auto no-repeat; opacity:.94; pointer-events:none; }
.amara-portal-inner { position:relative; z-index:1; height:620px; display:flex; flex-direction:column; justify-content:center; }
@media (max-width:760px) { .amara-portal,.amara-portal-inner { min-height:500px; height:500px; } .amara-portal-image { background-position:61% center; background-size:auto 100%; background-image:linear-gradient(90deg,#080713 0%,rgba(8,7,19,.79) 53%,rgba(8,7,19,.26) 100%),linear-gradient(0deg,#080713 0%,transparent 38%,rgba(8,7,19,.25) 100%),url('assets/amara-presence-v1.png'); } }

/* Agents: four individual presences, visually connected but deliberately unnamed by imagery. */
.agents-main { position:relative; overflow:hidden; }
.agents-content { position:relative; z-index:1; }
.agents-presences { position:absolute; z-index:0; top:25px; right:0; width:min(67vw,1120px); height:570px; pointer-events:none; background:linear-gradient(90deg,#0a1322 0%,rgba(10,19,34,.95) 10%,rgba(10,19,34,.28) 45%,rgba(10,19,34,.08) 100%),linear-gradient(0deg,#0a1322 0%,transparent 24%,rgba(10,19,34,.15) 100%),url('assets/agents-four-presences-v1.png') right top/auto 570px no-repeat; opacity:.92; }
@media (max-width:760px) { .agents-presences { top:20px; width:100%; height:350px; background-size:auto 350px; opacity:.46; } .agents-content { padding-top:75px; } }

/* A.M.A.R.A. product visual: a shared centre above a still-forming structure. */
.product-structure-art { min-height:455px; overflow:hidden; border:1px solid #283348; border-radius:8px; background:#080e17 url('assets/amara-product-structure-v2.png') center/cover no-repeat; box-shadow:0 24px 60px rgba(10,19,34,.18); }
@media (max-width:760px) { .product-structure-art { min-height:360px; } }

/* AI systems: the categories live in the page copy; the hero stays a wordless map. */
.models-page .models-hero { position:relative; isolation:isolate; display:block; min-height:620px; padding:0; overflow:hidden; background:#0a1322; }
.models-page .models-hero:after { content:''; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#0a1322 0%,rgba(10,19,34,.96) 31%,rgba(10,19,34,.62) 53%,rgba(10,19,34,.08) 78%,rgba(10,19,34,.12) 100%),linear-gradient(0deg,#0a1322 0%,transparent 33%,rgba(10,19,34,.17) 100%); }
.models-map-art { position:absolute; z-index:-2; inset:0; pointer-events:none; background:#0a1322 url('assets/ai-systems-map-v1.png') right center/auto 100% no-repeat; }
.models-hero-inner { position:relative; z-index:1; min-height:620px; display:flex; flex-direction:column; justify-content:center; }
.models-page .models-hero h1 { color:#f3f4f8; }
.models-page .models-hero .models-lead { color:#c5ccda; }
@media (max-width:760px) { .models-page .models-hero,.models-hero-inner { min-height:560px; } .models-map-art { background-size:auto 100%; background-position:64% center; opacity:.67; } }

/* Products uses the same full-bleed visual language as Amara and Agents. */
.product-hero { position:relative; isolation:isolate; display:block; min-height:620px; padding:0; overflow:hidden; background:#0a1322; }
.product-hero:after { content:''; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#0a1322 0%,rgba(10,19,34,.96) 31%,rgba(10,19,34,.58) 52%,rgba(10,19,34,.06) 78%,rgba(10,19,34,.14) 100%),linear-gradient(0deg,#0a1322 0%,transparent 35%,rgba(10,19,34,.2) 100%); }
.product-structure-art { position:absolute; z-index:-2; inset:0; min-height:0; border:0; border-radius:0; box-shadow:none; background-position:right center; background-size:auto 100%; }
.product-hero-inner { position:relative; z-index:1; min-height:620px; display:flex; align-items:center; }
.product-hero h1 { color:#f3f4f8; }
.product-tagline { color:#f0edf8; }
.product-lead { color:#c0c8d6; }
.product-hero .release-note { border-left-color:#9d8cff; background:rgba(24,29,51,.64); color:#d1d5df; box-shadow:inset 0 1px 0 rgba(255,255,255,.06); backdrop-filter:blur(11px); }
.product-hero .release-note strong { color:#f0f1f4; }
.product-hero .product-tagline { color:#f0edf8; }
.product-hero .product-lead { color:#c0c8d6; }
.products-page .product-hero { display:block; min-height:620px; padding:0; }

/* Product onboarding: real commands in terminal-shaped, copyable cards. */
.install-section { padding:112px 0 120px; color:#edf0f7; background:#0a1322; }
.install-heading { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end; }
.install-heading h2 { max-width:540px; margin:18px 0 0; color:#f3f4f8; }
.install-heading > p { max-width:510px; margin:0; color:#bdc6d5; font-size:16px; line-height:1.8; }
.install-note { margin:34px 0 27px; color:#818da1; font:12px/1.6 'DM Mono'; }
.terminal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.terminal-card { overflow:hidden; border:1px solid #2b3951; border-radius:8px; background:#101a2a; box-shadow:0 22px 50px rgba(0,0,0,.18); }
.terminal-card header { display:flex; align-items:center; gap:11px; min-height:65px; padding:13px 16px; border-bottom:1px solid #2b3951; background:#0d1522; }
.platform-glyph { width:33px; height:33px; display:grid; place-items:center; flex:none; border:1px solid #46516a; border-radius:7px; color:#dce5f4; background:#172238; font:700 16px/1 'DM Mono'; }
.mac .platform-glyph { border-color:rgba(100,213,214,.48); color:#7adfe0; } .windows .platform-glyph { border-color:rgba(143,119,255,.48); color:#b2a2ff; } .linux .platform-glyph { border-color:rgba(112,178,255,.48); color:#8fc8ff; font-size:13px; }
.terminal-card header div { display:grid; gap:3px; } .terminal-card header strong { font-size:13px; } .terminal-card header small { color:#8d98ab; font:10px 'DM Mono'; }
.terminal-status { margin-left:auto; color:#74809a; font:10px 'DM Mono'; }
.terminal-screen { min-height:206px; padding:21px 18px; background:radial-gradient(circle at 72% 8%,rgba(95,99,215,.1),transparent 35%),#0b111c; font:12px/1.65 'DM Mono'; }
.terminal-screen p { margin:0; } .terminal-prompt { color:#aeb8c9; } .terminal-prompt span { color:#7ee1c6; } .windows .terminal-prompt span { color:#9fa7ff; } .terminal-prompt b { color:#7faaf2; font-weight:400; }
.terminal-screen code { display:block; margin:2px 0 16px; overflow-wrap:anywhere; color:#f1f3f8; font:inherit; } .terminal-output { margin-bottom:16px !important; color:#627087; } .terminal-comment { margin:0 0 2px !important; color:#526179; font-size:11px; }
.terminal-card footer { min-height:98px; padding:15px 16px 16px; display:flex; flex-direction:column; justify-content:space-between; gap:13px; border-top:1px solid #2b3951; }
.terminal-card footer p { margin:0; color:#929eaf; font-size:11px; line-height:1.45; }
.copy-command { align-self:flex-start; padding:0; border:0; color:#b9adff; background:none; cursor:pointer; font:600 11px 'Manrope'; } .copy-command:hover { color:white; }
.install-disclaimer { max-width:720px; margin:28px 0 0; color:#758196; font-size:11px; line-height:1.7; }
@media (max-width:760px) { .install-section { padding:75px 0 82px; } .install-heading,.terminal-grid { grid-template-columns:1fr; gap:25px; } .install-note { margin-top:27px; } .terminal-grid { gap:13px; } .terminal-screen { min-height:176px; } }
@media (max-width:760px) { .product-hero { min-height:560px; } .product-hero-inner { min-height:560px; } .product-structure-art { background-size:auto 100%; background-position:70% center; opacity:.68; } }

.products-page { background:#f5f3ef; } .products-header { position:relative; background:#0a1322; } .products-header nav .active { color:#c7bcff; } .product-hero { min-height:660px; padding:106px 0; display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:70px; } .product-hero h1 { margin:20px 0 8px; font-size:clamp(56px,7vw,96px); letter-spacing:.04em; } .product-tagline { margin-bottom:22px; color:#20263a; font:600 clamp(28px,3vw,42px)/1.12 'Playfair Display'; } .product-lead { max-width:520px; color:#4e5868; font-size:16px; line-height:1.8; } .release-note { display:flex; align-items:flex-start; gap:12px; max-width:535px; margin-top:31px; padding:16px 18px; border-left:2px solid var(--violet); background:#e8e4f5; color:#4b5261; font-size:13px; line-height:1.55; } .release-note span { width:8px; height:8px; flex:none; margin-top:6px; border-radius:50%; background:#aa99ff; box-shadow:0 0 0 4px rgba(156,140,255,.15); } .release-note p { margin:0; } .room-preview { position:relative; min-height:400px; display:grid; grid-template-columns:142px 1fr; overflow:hidden; border:1px solid #283348; border-radius:8px; color:#dce1eb; background:#111927; box-shadow:0 24px 60px rgba(10,19,34,.18); font-size:11px; } .room-preview header { grid-column:1 / -1; height:47px; display:flex; align-items:center; justify-content:space-between; padding:0 17px; border-bottom:1px solid #283348; font-size:12px; } .room-preview header b { letter-spacing:.12em; } .room-preview header span { color:#9a8bff; } .room-preview aside { padding:16px 11px; border-right:1px solid #283348; background:#0d1420; } .room-preview aside p { margin:0 0 13px; color:#8c94a5; font:9px 'DM Mono'; letter-spacing:.11em; } .room-preview aside b { display:block; margin:8px 0; padding:8px; border-radius:4px; background:#222e44; font-weight:600; } .room-preview section { min-width:0; display:grid; grid-template-rows:42px 1fr 55px; } .room-tabs { display:flex; align-items:center; gap:16px; padding:0 15px; border-bottom:1px solid #283348; color:#9ca5b7; } .room-tabs span:first-child { color:#e8eaf0; border-bottom:2px solid #9b8aff; height:42px; display:flex; align-items:center; } .room-blank { display:flex; flex-direction:column; justify-content:center; align-items:center; color:#aeb7c6; } .room-blank i { width:31px; height:31px; margin-bottom:13px; border:1px solid #836fed; border-radius:50%; box-shadow:0 0 20px rgba(130,105,230,.3); } .room-blank p { margin:0 0 5px; color:#e1e4ec; font-weight:700; } .room-blank small { color:#8c96a8; } .room-preview section footer { display:grid; grid-template-columns:78px 1fr 66px; align-items:center; gap:8px; padding:9px 11px; border-top:1px solid #283348; } .room-preview section footer span,.room-preview section footer div { height:32px; display:flex; align-items:center; padding:0 9px; border:1px solid #344056; border-radius:4px; color:#aab2c0; } .room-preview section footer button { height:32px; border:0; border-radius:4px; color:#bec5d4; background:#303b52; } .product-details { padding:115px 0; display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; border-top:1px solid var(--line); } .product-details h2 { margin-top:20px; } .details-list article { display:grid; grid-template-columns:50px 1fr; padding:22px 0; border-top:1px solid var(--line); } .details-list article:last-child { border-bottom:1px solid var(--line); } .details-list span,.platform-grid span { color:#7767d5; font:11px 'DM Mono'; } .details-list h3 { margin:0 0 8px; font-size:20px; letter-spacing:-.05em; } .details-list p { grid-column:2; margin:0; color:#596271; font-size:14px; line-height:1.7; } .platform-section { padding:110px 0; color:white; background:#0a1322; } .platform-section h2 { margin:20px 0 47px; } .platform-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(255,255,255,.2); border-left:1px solid rgba(255,255,255,.2); } .platform-grid article { min-height:190px; padding:22px; border-right:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(255,255,255,.2); } .platform-grid h3 { margin:47px 0 9px; font-size:21px; letter-spacing:-.05em; } .platform-grid p { margin:0; color:#b7becb; font-size:13px; line-height:1.65; } @media (max-width:760px) { .product-hero,.product-details { grid-template-columns:1fr; gap:45px; } .product-hero { min-height:0; padding:76px 0; } .room-preview { min-height:360px; grid-template-columns:105px 1fr; } .room-preview aside { padding:13px 8px; } .room-preview aside b { padding:7px 5px; font-size:9px; } .room-tabs { gap:9px; padding:0 8px; font-size:9px; } .product-details { padding:75px 0; } .platform-section { padding:75px 0; } .platform-grid { grid-template-columns:1fr 1fr; } .platform-grid article { min-height:155px; } .platform-grid h3 { margin-top:28px; } }

.work-showcase { padding:112px 0 120px; color:#eef1f8; background:#0a1322; } .work-showcase-heading { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end; margin-bottom:48px; } .work-showcase-heading h2 { margin:18px 0 0; color:#f4f5f8; } .work-showcase-heading>p { max-width:500px; margin:0; color:#bdc6d5; font-size:16px; line-height:1.8; } .work-player { position:relative; overflow:hidden; border:1px solid #2b3951; border-radius:8px; background:#101722; box-shadow:0 25px 65px rgba(0,0,0,.25); } .work-slide { display:none; margin:0; } .work-slide.is-active { display:block; } .work-slide img { display:block; width:100%; max-height:590px; object-fit:contain; background:#070b12; } .work-slide figcaption { display:flex; gap:19px; align-items:flex-start; min-height:104px; padding:22px 25px; border-top:1px solid #2b3951; background:#101722; } .work-slide figcaption>span { padding-top:3px; color:#a898ff; font:11px 'DM Mono'; } .work-slide figcaption strong { display:block; margin-bottom:5px; color:#f1f3f8; font-size:15px; } .work-slide figcaption p { margin:0; color:#aeb8c9; font-size:13px; line-height:1.6; } .work-player-controls { position:absolute; right:18px; bottom:18px; display:flex; align-items:center; gap:9px; } .work-player-controls p { min-width:47px; margin:0; color:#aeb8c9; text-align:center; font:11px 'DM Mono'; } .work-player-button { width:33px; height:33px; border:1px solid #46516a; border-radius:50%; color:#ecedf4; background:#172238; cursor:pointer; font-size:17px; transition:.2s; } .work-player-button:hover { color:#10131b; background:#c7bcff; border-color:#c7bcff; } @media (max-width:760px) { .work-showcase { padding:75px 0 82px; } .work-showcase-heading { grid-template-columns:1fr; gap:22px; margin-bottom:32px; } .work-slide img { max-height:480px; } .work-slide figcaption { min-height:112px; padding:18px; padding-right:150px; } .work-player-controls { right:15px; bottom:19px; } }
