:root{--forest:#345c44;--forest-deep:#173a2b;--gold:#d8a64a;--rust:#a85d3b;--cream:#f5f1e8;--paper:#fffdf8;--ink:#171713;--muted:#625f57;--line:#d9d0bf;--soft:#e7ecdf;--display:Georgia,"Times New Roman",serif;--body:Inter,"Segoe UI",Roboto,Arial,sans-serif;--mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace}
*{box-sizing:border-box}html{background:var(--cream);color:var(--ink);font-family:var(--body);scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(circle at 88% 8%,rgba(216,166,74,.12),transparent 28rem),var(--cream)}button,textarea,select{font:inherit}.skip{position:fixed;z-index:100;top:.5rem;left:.5rem;transform:translateY(-180%);background:var(--ink);color:white;padding:.6rem 1rem;border-radius:.4rem}.skip:focus{transform:none}.app-shell{min-height:100vh}.topbar{position:sticky;z-index:10;top:0;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem clamp(1rem,4vw,3rem);border-bottom:1px solid rgba(52,92,68,.16);background:rgba(245,241,232,.94);backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:.65rem;color:var(--forest-deep);font-family:var(--display);font-size:1.3rem;font-weight:650;text-decoration:none}.brand img{border-radius:.55rem}.top-actions,.network{display:flex;align-items:center;gap:.55rem}.network{color:var(--muted);font-size:.8rem}.network i{width:.55rem;height:.55rem;border-radius:50%;background:#858078}.network.online i{background:var(--forest)}.network.offline i{background:var(--rust)}button{border:0;cursor:pointer}.quiet,.icon-button,.profile-button{border:1px solid var(--line);background:var(--paper);color:var(--ink)}.quiet{padding:.55rem .8rem;border-radius:.6rem;font-weight:700}.icon-button{display:grid;place-items:center;width:2.65rem;height:2.65rem;border-radius:50%;font-size:1.15rem}.hide{display:none!important}main{width:min(68rem,calc(100% - 2rem));margin:auto;padding:clamp(2rem,6vw,5rem) 0 3rem}.intro{display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:2rem;margin-bottom:2rem}.eyebrow{margin:0 0 .6rem;color:var(--rust);font:500 .69rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase}.intro h1{grid-row:1/3;margin:0;font:550 clamp(2.5rem,7vw,5.7rem)/.95 var(--display);letter-spacing:-.045em}.intro h1 em{color:var(--forest);font-style:italic}.intro>p:last-child{margin:0;color:var(--muted);font-size:1.03rem;line-height:1.65}.conversation-card{overflow:hidden;border:1px solid var(--line);border-radius:1.25rem;background:var(--paper);box-shadow:0 26px 80px rgba(47,38,23,.12)}.conversation-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.2rem;border-bottom:1px solid var(--line)}.conversation-head>div{display:flex;flex-direction:column}.mini-label{color:var(--muted);font-size:.72rem}.profile-button{padding:.45rem .75rem;border-radius:.5rem;font-weight:700}.release-notice{display:flex;gap:.45rem;padding:.75rem 1.2rem;background:#f8eed7;color:#62480f;font-size:.83rem}.messages{min-height:14rem;padding:clamp(1rem,4vw,2rem);background:linear-gradient(145deg,var(--forest-deep),#244d39);color:white}.message{max-width:39rem;padding:1rem 1.1rem;border:1px solid rgba(255,255,255,.14);border-radius:1rem 1rem 1rem .25rem;background:rgba(255,255,255,.08)}.message p{margin:.2rem 0 0;font-size:1.05rem;line-height:1.55}.speaker{color:#f2ca76;font:500 .65rem var(--mono);letter-spacing:.09em;text-transform:uppercase}.voice-state{display:flex;align-items:center;justify-content:center;gap:1rem;padding:1.2rem;border-bottom:1px solid var(--line)}.voice-state p{margin:.15rem 0 0;color:var(--muted);font-size:.82rem}.voice-orb{display:flex;align-items:center;gap:3px;width:3.2rem;height:3.2rem;justify-content:center;border-radius:50%;background:var(--soft);border:1px solid #c9d1bd}.voice-orb span{width:3px;height:20%;border-radius:3px;background:var(--forest)}.voice-orb span:nth-child(2),.voice-orb span:nth-child(4){height:45%}.voice-orb span:nth-child(3){height:65%}.composer{display:grid;grid-template-columns:1fr auto;gap:.65rem;padding:1rem 1.2rem}.composer textarea{min-height:3.2rem;max-height:10rem;resize:vertical;padding:.82rem 1rem;border:1px solid var(--line);border-radius:.8rem;background:white;color:var(--ink)}.send,.primary{padding:.75rem 1.1rem;border-radius:.7rem;background:var(--forest);color:white;font-weight:750}.voice-controls{display:flex;align-items:center;gap:.7rem;padding:0 1.2rem 1.15rem}.talk{padding:.7rem 1rem;border-radius:.7rem;background:#d5d0c5;color:#6d6961;font-weight:750}.talk+span{color:var(--muted);font-size:.78rem}.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}.principles article{padding:1.2rem;border:1px solid var(--line);border-radius:1rem;background:rgba(255,253,248,.72)}.principles span{color:var(--rust);font:500 .65rem var(--mono)}.principles h2{margin:.55rem 0 .35rem;font:600 1.15rem var(--display)}.principles p{margin:0;color:var(--muted);font-size:.88rem;line-height:1.55}footer{display:flex;justify-content:center;gap:.7rem;padding:1.5rem;color:var(--muted);font-size:.82rem}footer a{color:var(--forest);font-weight:700}dialog{width:min(38rem,calc(100% - 1.2rem));padding:0;border:0;border-radius:1rem;background:var(--paper);color:var(--ink);box-shadow:0 30px 90px rgba(0,0,0,.3)}dialog::backdrop{background:rgba(15,20,16,.64);backdrop-filter:blur(4px)}.dialog-card{padding:1.2rem}.dialog-card header{display:flex;justify-content:space-between;gap:1rem}.dialog-card h2{margin:0;font:600 1.65rem var(--display)}.dialog-copy{color:var(--muted);font-size:.9rem}.profile-list{display:grid;gap:.55rem;max-height:50vh;overflow:auto}.profile-option{display:flex;justify-content:space-between;gap:1rem;width:100%;padding:.85rem;text-align:left;border:1px solid var(--line);border-radius:.7rem;background:white;color:var(--ink)}.profile-option:disabled{cursor:not-allowed;opacity:.6}.profile-option strong,.profile-option span{display:block}.profile-option small{color:var(--muted)}.profile-option .stage{color:var(--rust);font:500 .62rem var(--mono);text-transform:uppercase}.setting{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}.setting p{margin:.2rem 0 0;color:var(--muted);font-size:.82rem}.setting select{max-width:10rem;padding:.55rem;border:1px solid var(--line);border-radius:.55rem;background:white}.status-pill{padding:.25rem .55rem;border-radius:99px;background:var(--soft);color:var(--forest-deep);font-size:.75rem;font-weight:700}.close-settings{width:100%;margin-top:1rem}.toast{position:fixed;z-index:50;bottom:1rem;left:50%;transform:translateX(-50%);max-width:calc(100% - 2rem);padding:.7rem 1rem;border-radius:.7rem;background:var(--ink);color:white;text-align:center;font-size:.85rem}.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}:focus-visible{outline:3px solid var(--gold);outline-offset:3px}@media(max-width:760px){.topbar{padding:.65rem .8rem}.network span{display:none}.intro{display:block;margin-bottom:1.25rem}.intro h1{margin-bottom:1rem}.release-notice{display:block}.release-notice strong{display:block;margin-bottom:.2rem}.principles{grid-template-columns:1fr}.voice-controls{align-items:flex-start;flex-direction:column}.conversation-card{border-radius:1rem}.messages{min-height:12rem}}@media(max-width:430px){main{width:min(100% - 1rem,68rem);padding-top:1.35rem}.brand span{font-size:1.1rem}.install{display:none!important}.intro h1{font-size:2.7rem}.conversation-head,.composer{padding:.85rem}.voice-state{justify-content:flex-start}.composer{grid-template-columns:1fr}.send{width:100%}.top-actions{gap:.35rem}}
.dialog-card label{display:block;margin:.7rem 0 .3rem;font-size:.82rem;font-weight:700}.dialog-card input[type=email]{width:100%;padding:.75rem;border:1px solid var(--line);border-radius:.6rem;background:white;color:var(--ink)}#loginRequestForm .primary{width:100%;margin-top:.75rem}.account-status{min-height:1.3rem;color:var(--muted);font-size:.82rem}.account-actions{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1rem}.danger-button{padding:.55rem .8rem;border-radius:.6rem;background:#8a301f;color:white;font-weight:700}
.dialog-card .consent-check{display:flex;align-items:flex-start;gap:.55rem;margin-top:1rem;font-weight:500;line-height:1.45}.consent-check input{margin-top:.2rem}.consent-check a{color:var(--forest-deep)}
.message.user{margin-left:auto;border-radius:1rem 1rem .25rem 1rem;background:rgba(216,166,74,.16)}
.notice{width:min(48rem,calc(100% - 2rem));margin:0 auto;padding:3rem 0 5rem}.notice h1{font:600 clamp(2.2rem,7vw,4.4rem)/1 var(--display);color:var(--forest-deep)}.notice h2{margin-top:2rem;font:600 1.45rem var(--display)}.notice p,.notice li{line-height:1.7;color:var(--muted)}.notice .summary{padding:1rem 1.2rem;border-left:4px solid var(--gold);background:var(--paper)}.notice a{color:var(--forest-deep);font-weight:700}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Premium split-hero release */
body{background:radial-gradient(circle at 92% 4%,rgba(216,166,74,.18),transparent 25rem),radial-gradient(circle at 8% 62%,rgba(52,92,68,.08),transparent 30rem),var(--cream)}
.topbar{padding:.8rem clamp(1rem,4vw,4rem);box-shadow:0 1px 0 rgba(255,255,255,.75),0 8px 30px rgba(32,43,34,.04)}
.brand img{box-shadow:0 5px 15px rgba(23,58,43,.16)}
.quiet,.icon-button,.profile-button,.send,.primary,.principles article{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background-color .2s ease}
.quiet:hover,.icon-button:hover,.profile-button:hover{transform:translateY(-2px);border-color:#b8ad99;box-shadow:0 7px 18px rgba(34,39,32,.08)}
.quiet:active,.icon-button:active,.profile-button:active,.send:active,.primary:active{transform:translateY(0) scale(.98)}
.network.online i{animation:onlinePulse 2.5s ease-out infinite}
main{width:min(82rem,calc(100% - clamp(2rem,7vw,7rem)));padding:clamp(2.5rem,6vw,5.5rem) 0 4rem}
.hero{position:relative;display:grid;grid-template-columns:minmax(0,.84fr) minmax(31rem,1.16fr);align-items:center;gap:clamp(2.2rem,5vw,5.8rem);overflow:hidden;padding:clamp(2rem,4.2vw,4.3rem);border:1px solid rgba(255,255,255,.45);border-radius:2rem;background-image:linear-gradient(90deg,rgba(13,44,31,.9) 0%,rgba(18,53,38,.72) 38%,rgba(245,241,232,.85) 59%,rgba(245,241,232,.98) 76%),url('./media/accra-friends-900.webp');background-position:center;background-size:cover;box-shadow:0 32px 85px rgba(30,43,34,.15)}
.hero:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px rgba(255,255,255,.45);pointer-events:none}
.hero-copy{position:relative;z-index:1;padding:1rem 0;color:white;text-shadow:0 1px 20px rgba(8,24,17,.14)}
.eyebrow-dot{display:inline-block;width:.45rem;height:.45rem;margin-right:.4rem;border-radius:50%;background:var(--gold);box-shadow:0 0 0 .3rem rgba(216,166,74,.14)}
.hero-copy h1{max-width:9.8ch;margin:.7rem 0 1.35rem;font:550 clamp(3.7rem,6.8vw,6.6rem)/.88 var(--display);letter-spacing:-.058em;color:white}
.hero-copy h1 em{color:#f1ca7c;font-weight:500}
.hero-lede{max-width:36rem;margin:0;color:rgba(255,255,255,.88);font-size:clamp(1.03rem,1.5vw,1.24rem);line-height:1.62}
.language-line{display:flex;align-items:center;flex-wrap:wrap;gap:.65rem;margin-top:1.5rem;color:white;font:700 .72rem var(--mono);letter-spacing:.045em;text-transform:uppercase}
.language-line i{width:1.8rem;height:1px;background:var(--gold)}
.trust-row{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.2rem}
.trust-row span{display:flex;align-items:center;gap:.35rem;padding:.42rem .62rem;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(12,39,27,.34);color:rgba(255,255,255,.9);font-size:.72rem;box-shadow:inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(7px);transition:transform .2s ease,border-color .2s ease}
.trust-row span:hover{transform:translateY(-2px);border-color:rgba(52,92,68,.32)}
.trust-row b{color:var(--rust)}
.hero-note{max-width:34rem;margin:1.3rem 0 0;padding:.85rem 1rem;border-left:2px solid var(--gold);background:linear-gradient(90deg,rgba(8,31,21,.55),transparent);color:rgba(255,255,255,.77);font-size:.78rem;line-height:1.55}
.hero-note strong{color:white}
.hero-location{display:flex;align-items:center;gap:.45rem;margin:1.1rem 0 0;color:rgba(255,255,255,.72);font:500 .63rem var(--mono);letter-spacing:.08em;text-transform:uppercase}
.hero-photo{position:absolute;z-index:-1;right:-1.4rem;bottom:-2.5rem;width:8.3rem;height:10.5rem;margin:0;overflow:hidden;border:4px solid rgba(255,253,248,.95);border-radius:4.2rem 4.2rem 1.2rem 1.2rem;box-shadow:0 20px 45px rgba(47,38,23,.19);transform:rotate(2deg);transition:transform .5s cubic-bezier(.2,.75,.25,1)}
.hero-photo:hover{transform:rotate(0) translateY(-5px)}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 56%;transition:transform .7s ease}
.hero-photo:hover img{transform:scale(1.045)}
.hero-photo figcaption{position:absolute;inset:auto 0 0;padding:.8rem .65rem .6rem;background:linear-gradient(transparent,rgba(14,27,20,.88));color:white;text-align:center}
.hero-photo figcaption span,.hero-photo figcaption strong{display:block}.hero-photo figcaption span{font-size:.55rem;text-transform:uppercase;letter-spacing:.08em}.hero-photo figcaption strong{font:600 .72rem var(--display)}
.conversation-card{position:relative;isolation:isolate;overflow:hidden;border-color:rgba(52,92,68,.22);border-radius:1.6rem;box-shadow:0 35px 90px rgba(37,44,37,.18),0 3px 10px rgba(37,44,37,.07);animation:cardEnter .7s .12s both cubic-bezier(.2,.75,.25,1)}
.card-glow{position:absolute;z-index:-1;top:-7rem;right:-6rem;width:16rem;height:16rem;border-radius:50%;background:rgba(216,166,74,.18);filter:blur(2rem);pointer-events:none}
.conversation-head{padding:1.05rem 1.25rem;background:rgba(255,253,248,.94)}
.profile-identity{display:flex!important;flex-direction:row!important;align-items:center;gap:.7rem}
.profile-mark{display:grid;place-items:center;width:2.35rem;height:2.35rem;border-radius:.75rem;background:linear-gradient(145deg,var(--forest),var(--forest-deep));color:#f7d58f;font:600 1rem var(--display);box-shadow:0 6px 15px rgba(23,58,43,.2)}
.profile-identity>div{display:flex;flex-direction:column}
.release-notice{padding:.75rem 1.25rem;border-bottom:1px solid rgba(98,72,15,.09);background:linear-gradient(90deg,#f8eed7,#fcf6e9)}
.messages{position:relative;min-height:18rem;padding:2rem;background:radial-gradient(circle at 92% 15%,rgba(216,166,74,.18),transparent 15rem),linear-gradient(145deg,#132f23,#28533d)}
.messages:before{content:"";position:absolute;inset:0;opacity:.13;background-image:radial-gradient(rgba(255,255,255,.6) .6px,transparent .6px);background-size:16px 16px;pointer-events:none}
.message-time{position:relative;display:flex;align-items:center;justify-content:center;gap:.7rem;margin:0 0 1.4rem;color:rgba(255,255,255,.54);font:500 .58rem var(--mono);letter-spacing:.08em;text-transform:uppercase}
.message-time span{width:2rem;height:1px;background:rgba(255,255,255,.22)}
.message{position:relative;max-width:33rem;border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.095);box-shadow:0 10px 26px rgba(0,0,0,.09);backdrop-filter:blur(9px);animation:messageIn .42s both ease-out}
.voice-state{justify-content:flex-start;padding:1.05rem 1.25rem;background:rgba(255,253,248,.86)}
.voice-orb{box-shadow:inset 0 0 0 4px rgba(255,255,255,.55)}
.composer{padding:1rem 1.25rem .75rem}
.composer textarea{border-color:#d3c9b6;box-shadow:inset 0 1px 2px rgba(30,30,20,.03);transition:border-color .2s ease,box-shadow .2s ease}
.composer textarea:focus{outline:0;border-color:var(--forest);box-shadow:0 0 0 3px rgba(52,92,68,.12)}
.send,.primary{background:linear-gradient(145deg,#3d684d,var(--forest-deep));box-shadow:0 7px 18px rgba(23,58,43,.17)}
.send:hover,.primary:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(23,58,43,.24)}
.voice-controls{padding:0 1.25rem 1.2rem}
.principles{grid-template-columns:1.15fr repeat(3,1fr);align-items:stretch;gap:.8rem;margin-top:clamp(4rem,8vw,7rem)}
.section-intro{padding:1.3rem 1.5rem 1.3rem 0}
.section-intro h2{margin:.5rem 0 0;font:550 clamp(2rem,3vw,3.2rem)/1 var(--display);letter-spacing:-.035em;color:var(--forest-deep)}
.principles article{position:relative;min-height:15rem;padding:1.35rem;border-color:rgba(52,92,68,.14);background:rgba(255,253,248,.7);box-shadow:0 12px 32px rgba(47,38,23,.045)}
.principles article:hover{transform:translateY(-5px);border-color:rgba(52,92,68,.3);box-shadow:0 20px 42px rgba(47,38,23,.09)}
.principle-icon{display:grid;place-items:center;width:2.5rem;height:2.5rem;margin:1.3rem 0 .85rem;border-radius:.8rem;background:var(--soft);color:var(--forest-deep);font:700 .82rem var(--mono);transition:transform .2s ease}
.principles article:hover .principle-icon{transform:rotate(-4deg) scale(1.06)}
.principles h3{margin:0 0 .45rem;font:600 1.15rem var(--display);color:var(--forest-deep)}
.language-story{display:grid;grid-template-columns:1.12fr .88fr;align-items:center;overflow:hidden;margin-top:clamp(4rem,8vw,7rem);border-radius:1.6rem;background:var(--forest-deep);color:white;box-shadow:0 28px 70px rgba(23,58,43,.19)}
.language-story figure{height:100%;min-height:29rem;margin:0;overflow:hidden}
.language-story img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.language-story:hover img{transform:scale(1.025)}
.language-story>div{padding:clamp(2rem,5vw,4.5rem)}
.language-story .eyebrow{color:#e9bd68}
.language-story h2{margin:.7rem 0 1.1rem;font:550 clamp(2.3rem,4vw,4rem)/.98 var(--display);letter-spacing:-.04em}
.language-story h2 em{color:#e9bd68;font-weight:500}
.language-story p{color:rgba(255,255,255,.76);line-height:1.7}
.story-status{padding:1rem 0 0;border-top:1px solid rgba(255,255,255,.16);font-size:.82rem}.story-status span{margin-right:.4rem;color:#e9bd68}
footer{flex-direction:column;align-items:center;padding:2rem 1rem 2.5rem}footer div{display:flex;gap:.7rem}footer small{color:#79746a;text-align:center}footer small a{font-weight:600}
@keyframes cardEnter{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@keyframes messageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes onlinePulse{0%,45%{box-shadow:0 0 0 0 rgba(52,92,68,.3)}80%,100%{box-shadow:0 0 0 .45rem rgba(52,92,68,0)}}
@media(max-width:1050px){main{width:min(74rem,calc(100% - 2rem))}.hero{grid-template-columns:minmax(0,.8fr) minmax(29rem,1.2fr);gap:2rem;padding:2rem;background-image:linear-gradient(90deg,rgba(13,44,31,.92),rgba(18,53,38,.79) 42%,rgba(245,241,232,.92) 62%,rgba(245,241,232,.99) 78%),url('./media/accra-friends-900.webp')}.hero-copy h1{font-size:clamp(3.35rem,6vw,5rem)}.principles{grid-template-columns:repeat(3,1fr)}.section-intro{grid-column:1/-1}}
@media(max-width:820px){main{width:min(100% - 2rem,42rem);padding-top:1.25rem}.hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding:1.25rem;background-image:linear-gradient(180deg,rgba(13,44,31,.84) 0%,rgba(18,53,38,.84) 43%,rgba(18,53,38,.95) 55%,rgba(245,241,232,.97) 70%),url('./media/accra-friends-900.webp');background-position:center top}.hero-copy{padding:.8rem}.hero-copy h1{max-width:none;font-size:clamp(3.3rem,13vw,5.2rem)}.conversation-card{margin-top:1rem}.principles{grid-template-columns:1fr;margin-top:4rem}.section-intro{grid-column:auto}.principles article{min-height:0}.language-story{grid-template-columns:1fr}.language-story figure{min-height:19rem;max-height:25rem}.language-story>div{padding:2rem}}
@media(max-width:520px){.topbar{padding:.65rem .75rem}.top-actions{gap:.35rem}.hero-copy h1{font-size:clamp(3rem,15vw,4.3rem)}.hero-lede{font-size:1rem}.hero-photo{display:none}.language-line{gap:.45rem;font-size:.64rem}.language-line i{width:.8rem}.trust-row{gap:.4rem}.trust-row span{font-size:.67rem}.release-notice{display:block}.release-notice strong{display:block;margin-bottom:.2rem}.conversation-card{border-radius:1.1rem}.messages{min-height:14rem;padding:1.15rem}.message p{font-size:.98rem}.voice-state{align-items:flex-start}.composer{grid-template-columns:1fr}.send{width:100%}.voice-controls{align-items:flex-start;flex-direction:column}.language-story{border-radius:1.1rem}.language-story figure{min-height:14rem}footer div{flex-wrap:wrap;justify-content:center}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Full-width human-context hero */
.hero{grid-template-columns:minmax(0,.84fr) minmax(31rem,1.16fr);align-items:start;padding:0 clamp(1.5rem,4vw,3.5rem) clamp(2rem,4vw,3.5rem);background:linear-gradient(135deg,#173a2b 0 43%,#f5f1e8 72%);background-image:none}
.hero:before{content:"";grid-column:1/-1;width:calc(100% + clamp(3rem,8vw,7rem));height:clamp(22rem,38vw,34rem);margin-left:calc(clamp(1.5rem,4vw,3.5rem) * -1);border-radius:2rem 2rem 0 0;background-image:linear-gradient(180deg,transparent 58%,rgba(16,45,32,.42) 82%,rgba(16,45,32,.88)),url('./media/accra-friends-900.webp');background-position:center 38%;background-size:cover}
.hero-copy{margin-top:clamp(-7rem,-7vw,-4.5rem);padding:clamp(1.25rem,2.5vw,2.2rem);border:1px solid rgba(255,255,255,.17);border-radius:1.4rem;background:rgba(15,49,34,.92);box-shadow:0 25px 55px rgba(13,38,27,.22);backdrop-filter:blur(10px)}
.hero-copy h1{font-size:clamp(3.15rem,5.3vw,5.35rem)}
.conversation-card{justify-self:end;width:100%;max-width:38.5rem;margin-top:clamp(-8.5rem,-8vw,-5.5rem)}
.conversation-card .conversation-head{padding:.85rem 1.1rem}
.conversation-card .release-notice{padding:.62rem 1.1rem;font-size:.77rem}
.conversation-card .messages{min-height:14rem;padding:1.45rem}
.conversation-card .voice-state{padding:.85rem 1.1rem}
.conversation-card .composer{padding:.8rem 1.1rem .65rem}
.conversation-card .voice-controls{padding:0 1.1rem .9rem}
@media(max-width:1050px){.hero{grid-template-columns:minmax(0,.8fr) minmax(29rem,1.2fr);padding:0 1.5rem 2rem;background:linear-gradient(135deg,#173a2b 0 43%,#f5f1e8 72%)}.hero:before{width:calc(100% + 3rem);height:clamp(20rem,42vw,27rem);margin-left:-1.5rem;background-position:center 35%}.hero-copy{margin-top:-4rem;padding:1.35rem}.conversation-card{margin-top:-5rem}}
@media(max-width:820px){.hero{display:flex;padding:0 1.25rem 1.25rem;background:linear-gradient(180deg,#173a2b 0 52%,#f5f1e8 76%)}.hero:before{flex:none;width:calc(100% + 2.5rem);height:clamp(14rem,64vw,22rem);margin-left:-1.25rem;background-image:linear-gradient(180deg,transparent 65%,rgba(16,45,32,.8)),url('./media/accra-friends-900.webp');background-position:center center}.hero-copy{margin-top:-2.4rem;padding:1.25rem}.conversation-card{max-width:none;margin-top:1rem}}
@media(max-width:520px){.hero{border-radius:1.55rem}.hero:before{height:clamp(13rem,64vw,17rem);border-radius:1.55rem 1.55rem 0 0}.hero-copy{margin-top:-1.8rem;border-radius:1.1rem}.hero-copy h1{font-size:clamp(2.8rem,14vw,4rem)}}

/* Final full-bleed desktop hero */
main{width:100%;padding:0 0 4rem}
.hero{display:grid;grid-template-columns:minmax(25rem,.82fr) minmax(33rem,1.18fr);align-items:center;gap:clamp(2.5rem,6vw,7rem);width:100%;min-height:calc(100svh - 69px);padding:clamp(2.5rem,5vw,5.5rem) clamp(2rem,6vw,6.5rem);border:0;border-radius:0;background-image:linear-gradient(90deg,rgba(9,38,25,.9) 0%,rgba(10,40,27,.7) 37%,rgba(10,38,26,.2) 58%,rgba(9,28,20,.24)),url('./media/accra-friends-900.webp');background-position:center 42%;background-size:cover;box-shadow:none}
.hero:before{display:none}
.hero:after{border-radius:0;background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 22%,transparent 75%,rgba(8,30,20,.15))}
.hero-copy{max-width:35rem;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none}
.hero-copy h1{font-size:clamp(3.5rem,5.7vw,6rem)}
.hero-note{max-width:31rem;background:linear-gradient(90deg,rgba(5,27,17,.52),transparent)}
.conversation-card{align-self:center;justify-self:end;max-width:38.5rem;margin:0;box-shadow:0 34px 85px rgba(6,24,16,.3),0 3px 10px rgba(6,24,16,.15)}
.principles,.language-story{width:min(82rem,calc(100% - clamp(2rem,7vw,7rem)));margin-right:auto;margin-left:auto}
@media(max-width:1050px){.hero{grid-template-columns:minmax(21rem,.78fr) minmax(29rem,1.22fr);gap:2rem;padding:2.5rem 2rem;background-image:linear-gradient(90deg,rgba(9,38,25,.93),rgba(10,40,27,.72) 42%,rgba(9,28,20,.24)),url('./media/accra-friends-900.webp');background-position:center}.hero-copy{margin:0;padding:0}.conversation-card{margin:0}}
@media(max-width:820px){main{width:100%;padding-top:0}.hero{display:flex;min-height:0;padding:2.5rem 1rem 1.25rem;background-image:linear-gradient(180deg,rgba(9,38,25,.76) 0%,rgba(10,40,27,.78) 36%,rgba(10,40,27,.95) 58%,#173a2b 78%),url('./media/accra-friends-900.webp');background-position:center top;background-size:auto 34rem}.hero-copy{margin:0;padding:1rem}.conversation-card{max-width:none;margin-top:1rem}.principles,.language-story{width:min(100% - 2rem,42rem)}}
@media(max-width:520px){.hero{border-radius:0}.hero-copy{margin:0;border-radius:0}.hero-copy h1{font-size:clamp(2.8rem,14vw,4rem)}}

/* Persistent voice-assistant widget */
.conversation-card{position:fixed;z-index:30;right:1.15rem;bottom:1.15rem;align-self:auto;justify-self:auto;width:min(20rem,calc(100vw - 2rem));max-width:20rem;max-height:calc(100svh - 5.5rem);margin:0;border:1px solid rgba(255,255,255,.72);border-radius:1.35rem;background:rgba(255,253,248,.96);box-shadow:0 24px 65px rgba(8,26,18,.3),0 2px 10px rgba(8,26,18,.14);backdrop-filter:blur(18px);animation:widgetEnter .45s .1s both cubic-bezier(.2,.75,.25,1)}
.conversation-card .card-glow{display:none}
.conversation-card .conversation-head{padding:.68rem .72rem;border-color:rgba(23,58,43,.11)}
.conversation-card .profile-identity{gap:.52rem}
.conversation-card .profile-mark{width:2rem;height:2rem;border-radius:.65rem;font-size:.82rem}
.conversation-card .mini-label{font-size:.58rem;line-height:1.1}
.conversation-card #profileName{font-size:.8rem;line-height:1.15}
.widget-icon{display:grid;place-items:center;width:2rem;height:2rem;padding:0;border-radius:.65rem}
.widget-icon svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.conversation-card .release-notice{display:flex;align-items:center;gap:.4rem;padding:.4rem .75rem;border-bottom:1px solid rgba(98,72,15,.08);background:#f8eed7;color:#6b4c10;font:700 .61rem var(--mono);letter-spacing:.055em;text-transform:uppercase}
.conversation-card .release-notice i{width:.4rem;height:.4rem;border-radius:50%;background:var(--gold);box-shadow:0 0 0 .22rem rgba(216,166,74,.14)}
.conversation-card .messages{min-height:9.5rem;max-height:12rem;padding:.9rem;background:radial-gradient(circle at 90% 10%,rgba(216,166,74,.12),transparent 10rem),linear-gradient(145deg,#123524,#234f38);overflow-y:auto}
.conversation-card .message-time{gap:.45rem;margin-bottom:.75rem;font-size:.5rem}
.conversation-card .message-time span{width:1.1rem}
.conversation-card .message{padding:.72rem .78rem;border-radius:.8rem .8rem .8rem .2rem}
.conversation-card .message p{font-size:.8rem;line-height:1.45}
.conversation-card .speaker{font-size:.52rem}
.conversation-card .voice-state{position:relative;display:grid;grid-template:1fr/1fr;place-items:center;justify-content:stretch;min-height:5.3rem;padding:.65rem;border:0;background:linear-gradient(180deg,#fffdf8,#f6f1e7)}
.voice-trigger{position:relative;z-index:2;grid-area:1/1;display:grid;place-items:center;width:3.75rem;height:3.75rem;padding:0;border:1px solid rgba(255,255,255,.6);border-radius:50%;background:linear-gradient(145deg,#3f7254,#173a2b);color:white;box-shadow:0 10px 25px rgba(23,58,43,.28),inset 0 1px rgba(255,255,255,.23);transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}
.voice-trigger svg{width:1.45rem;height:1.45rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.voice-trigger:disabled{cursor:not-allowed;opacity:.72;filter:saturate(.65)}
.voice-trigger:not(:disabled):hover{transform:translateY(-2px) scale(1.03);box-shadow:0 13px 28px rgba(23,58,43,.34),inset 0 1px rgba(255,255,255,.23)}
.conversation-card[data-voice-state="listening"] .voice-trigger{background:linear-gradient(145deg,#cf7c45,#9b442c)}
.conversation-card[data-voice-state="listening"] .voice-rings{animation:voicePulse 1.7s ease-out infinite}
.conversation-card[data-voice-state="thinking"] .voice-trigger{animation:voiceThink 1.1s ease-in-out infinite alternate}
.conversation-card[data-voice-state="speaking"] .voice-trigger{background:linear-gradient(145deg,#d7a74b,#98701d)}
.voice-rings{grid-area:1/1;width:4.5rem;height:4.5rem;border:1px solid rgba(52,92,68,.12);border-radius:50%;box-shadow:0 0 0 .45rem rgba(52,92,68,.045),0 0 0 .9rem rgba(52,92,68,.025)}
.conversation-card .composer,.conversation-card .voice-controls{display:none!important}
.settings-group{margin:1rem 0;padding:1rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.settings-group>strong{display:block;margin-bottom:.6rem;font-size:.82rem}
@keyframes widgetEnter{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@keyframes voicePulse{from{transform:scale(.92);opacity:.8}to{transform:scale(1.18);opacity:0}}
@keyframes voiceThink{from{transform:scale(.96)}to{transform:scale(1.04)}}
@media(max-width:520px){.conversation-card{right:.75rem;bottom:.75rem;width:calc(100vw - 1.5rem);max-width:none;max-height:calc(100svh - 5.25rem);border-radius:1.15rem}.conversation-card .messages{min-height:8.5rem;max-height:10rem}.conversation-card .voice-state{min-height:4.8rem}.voice-trigger{width:3.45rem;height:3.45rem}}

/* Keep the people, not the overlay, as the first visual focus. */
@media(min-width:821px){
  .hero{align-items:end;padding-left:clamp(1.5rem,4vw,4rem);padding-bottom:clamp(1.25rem,2.2vw,2rem);background-image:linear-gradient(rgba(7,30,19,.2),rgba(7,30,19,.2)),url('./media/accra-friends-900.webp');background-position:center 34%}
  .hero:after{display:none}
  .hero-copy{align-self:end;max-width:39rem;padding:0;border-radius:0;background:transparent;text-shadow:0 2px 14px rgba(0,0,0,.52)}
  .hero-copy>.eyebrow{display:inline-flex;align-items:center;margin-bottom:.45rem;padding:.42rem .62rem;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(6,28,18,.7);color:#f4c96f;box-shadow:0 5px 18px rgba(0,0,0,.12);text-shadow:none;backdrop-filter:blur(7px)}
  .hero-copy h1{max-width:14ch;margin:.5rem 0 .8rem;font-size:clamp(2.85rem,4vw,4.1rem);line-height:.92}
  .hero-lede{max-width:32rem;font-size:clamp(.95rem,1.25vw,1.08rem);line-height:1.45}
  .language-line{margin-top:.75rem}
  .trust-row{margin-top:.65rem}
  .hero-note{display:none}
  .hero-location{margin-top:.55rem}
}

/* Floating hero controls replace the reserved navigation bar. */
.conversations-home .topbar{position:absolute;z-index:40;top:0;left:0;width:100%;padding:1rem clamp(1rem,4vw,4rem);border:0;background:transparent;box-shadow:none;backdrop-filter:none}
.conversations-home .brand{color:white;text-shadow:0 2px 12px rgba(0,0,0,.55)}
.conversations-home .topbar .network{padding:.4rem .6rem;border-radius:999px;background:rgba(10,31,21,.46);color:white;backdrop-filter:blur(10px)}
.conversations-home .topbar .quiet,.conversations-home .topbar .icon-button{border-color:rgba(255,255,255,.45);background:rgba(255,253,248,.9);box-shadow:0 8px 24px rgba(9,27,18,.16)}
@media(min-width:821px){.conversations-home .hero{min-height:100svh}}
.settings-install{width:100%;margin-top:1rem}
.notice-renewal{margin:1rem 0;padding:1rem;border:1px solid #dbc386;border-radius:.75rem;background:#fff7e4}
.notice-renewal p{margin-top:0;font-weight:700}
.notice-renewal .primary{width:100%;margin-top:.65rem}
@media(max-width:520px){.conversations-home .topbar{padding:.7rem .75rem}.conversations-home .brand span{display:none}.conversations-home .topbar .network{padding:.35rem}.conversations-home .topbar .network span{display:none}}
