/* About Rylio. Page-scoped composition using the approved site tokens. */
html:has(.about-page){background:var(--ui-bg);color-scheme:light}
html[data-theme=dark]:has(.about-page){color-scheme:dark}
@media(prefers-color-scheme:dark){html:not([data-theme=light]):has(.about-page){color-scheme:dark}}
.about-page{margin:0;font-family:Geist,Arial,sans-serif;font-synthesis:none}
.about-page *{box-sizing:border-box}
html[data-lang=fr] .about-page [lang=en],html[data-lang=en] .about-page [lang=fr]{display:none!important}
.about-page a{color:inherit;text-underline-offset:4px;touch-action:manipulation}
.about-page button{font:inherit;touch-action:manipulation}
.about-page a:focus-visible,.about-page button:focus-visible{outline:2px solid var(--ui-focus);outline-offset:4px}
.about-page>main{padding:0;margin:0;max-width:none}
.about-page main :is(h1,h2,h3,p,figure){margin:0}
.about-page main h1{font:500 clamp(48px,6vw,88px)/1.04 'Bricolage Grotesque',sans-serif;letter-spacing:-.035em;text-wrap:balance}
.about-page main h2{font:500 clamp(36px,3.4vw,50px)/1.1 'Bricolage Grotesque',sans-serif;letter-spacing:-.025em;text-wrap:balance}
.about-page main h3{font:500 28px/1.15 'Bricolage Grotesque',sans-serif;letter-spacing:-.015em;text-wrap:balance}
.about-page main p{font:400 var(--type-reading-size)/var(--type-reading-line) Geist,sans-serif;text-wrap:pretty}
.about-page main .about-compact{font-size:var(--type-compact-size);line-height:var(--type-compact-line)}
.about-page main .about-caption,.about-page main figcaption{font:400 var(--type-caption-size)/var(--type-caption-line) Geist,sans-serif;color:var(--ui-muted)}
.about-wrap{width:min(100% - 60px,1380px);margin-inline:auto}
.about-section{padding-block:100px;scroll-margin-top:120px}
.about-skip{position:fixed;top:-80px;left:20px;z-index:100;padding:12px 18px;background:var(--ui-surface);border-radius:8px}
.about-skip:focus{top:16px}
.about-page .about-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 22px;background-color:var(--ui-action);color:var(--ui-action-text);border:1px solid transparent;border-radius:999px;font:500 15px/20px Geist,sans-serif;text-decoration:none;text-align:center;transition:background-color .2s ease-in-out,transform .2s ease-in-out}
.about-page .about-button:active{transform:scale(.98)}
.about-hero{position:relative;isolation:isolate;min-height:660px;background-color:var(--ui-feature);color:var(--ui-feature-text);border-radius:0 0 24px 24px}
.about-hero-image{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 55%;border-radius:inherit}
.about-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(17,17,18,.82),rgba(17,17,18,.24));border-radius:inherit}
.about-hero-inner{padding-top:190px;padding-bottom:170px}
.about-hero-copy{max-width:760px}
.about-hero-copy p{max-width:490px;margin-top:28px!important;color:var(--ui-feature-text)}
.about-hero-copy .about-button{margin-top:34px}
.about-page .about-button-on-photo{background-color:#F5F5F7;color:#171717}
.about-page .about-button-on-photo:focus-visible{outline-color:#F5F5F7}
.about-hero-foundation{position:absolute;bottom:0;right:0;width:49%;max-width:710px;border-radius:24px 0 0 0;background-color:var(--ui-bg);color:var(--ui-text);padding:28px 36px 24px}
.about-page main .about-kicker{font:500 14px/20px Geist,sans-serif;color:var(--ui-muted)}
.about-hero-foundation>div{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:16px}
.about-page .about-hero-foundation h2{font-size:24px;line-height:1.15;text-wrap:balance;letter-spacing:-.01em}
.about-centered{text-align:center;max-width:820px;margin-inline:auto}
.about-centered p{max-width:640px;margin:26px auto 0!important;color:var(--ui-muted)}
.about-contexts{margin-top:56px!important}
.about-context-images{display:grid;grid-template-columns:2fr 1fr 2fr;gap:24px}
.about-context-images img{display:block;width:100%;height:280px;object-fit:cover;border-radius:22px}
.about-context-images img:first-child{object-position:center 48%}
.about-context-images img:nth-child(2){object-position:45% center}
.about-contexts figcaption{margin-top:14px;text-align:center}
.about-story-columns{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin:48px 0 0;padding-inline:24px;color:var(--ui-muted)}
.about-purpose{background-color:var(--ui-surface)}
.about-purpose h2{max-width:900px}
.about-purpose-grid{display:grid;grid-template-columns:1fr 1fr;margin-top:52px;border-top:1px solid var(--ui-line)}
.about-purpose-grid article{padding:32px 48px 0 0}
.about-purpose-grid article+article{padding:32px 0 0 48px;border-left:1px solid var(--ui-line)}
.about-purpose-grid p{margin-top:24px!important;color:var(--ui-muted)}
.about-purpose-grid .about-compact{padding-top:24px;border-top:1px solid var(--ui-line)}
.about-founders{background-color:#111112;color:#F5F5F7}
.about-page .about-founders .about-kicker{color:#B8B8BE}
.about-founders h2{margin-top:18px!important;max-width:1000px}
.about-founders-lead{max-width:660px;margin-top:28px!important;color:#B8B8BE}
.about-founder-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:56px}
.about-founder-grid article{padding-top:26px;border-top:1px solid rgba(255,255,255,.1)}
.about-founder-grid h3{margin:18px 0 22px!important;font-size:34px!important}
.about-founder-grid .about-compact{color:#B8B8BE;max-width:550px}
.about-recognition-lead{max-width:660px;margin-top:28px!important;color:var(--ui-muted)}
.about-recognition-list{margin-top:48px}
.about-recognition-list article{display:grid;grid-template-columns:190px minmax(0,1fr) 200px;gap:28px;padding-block:30px;border-top:1px solid var(--ui-line);align-items:start}
.about-recognition-kind{color:var(--ui-muted);font:500 14px/20px Geist,sans-serif;padding-top:4px}
.about-recognition-list h3{font-size:24px!important}
.about-recognition-list p{margin-top:12px!important;color:var(--ui-muted)}
.about-source{display:inline-flex;min-height:44px;align-items:center;font-size:14px;line-height:20px}
.about-recognition .about-caption{border-top:1px solid var(--ui-line);padding-top:24px}
.about-next{text-align:center;border-top:1px solid var(--ui-line)}
.about-next p{max-width:640px;margin:28px auto 32px!important;color:var(--ui-muted)}
@media(hover:hover) and (pointer:fine){.about-page .about-button:hover{background-color:var(--ui-action-hover);transform:translateY(-1px)}.about-page .about-button-on-photo:hover{background-color:#DCDCE0}}
@media(max-width:1000px){.about-hero-inner{padding-top:170px}.about-hero-foundation{width:57%}.about-context-images{gap:16px}.about-story-columns{gap:32px;padding-inline:0}.about-recognition-list article{grid-template-columns:150px minmax(0,1fr);gap:24px}.about-source{grid-column:2}.about-founder-grid{gap:36px}.about-purpose-grid article{padding-right:28px}.about-purpose-grid article+article{padding-left:28px}}
@media(max-width:809px){.about-wrap{width:calc(100% - 40px)}.about-section{padding-block:64px;scroll-margin-top:112px}.about-page main h1{font-size:48px}.about-page main h2{font-size:36px}.about-page main h3{font-size:26px}.about-hero{min-height:0;border-radius:0 0 20px 20px}.about-hero-inner{padding-top:164px;padding-bottom:54px}.about-hero-copy p{margin-top:24px!important}.about-hero-foundation{position:relative;width:calc(100% - 20px);margin-left:20px;padding:24px;max-width:none}.about-hero-foundation>div{gap:20px}.about-page .about-hero-foundation h2{font-size:22px}.about-contexts{margin-top:36px!important}.about-context-images{grid-template-columns:1fr 1fr;gap:12px}.about-context-images img{height:200px;border-radius:16px}.about-context-images img:last-child{grid-column:1/-1;height:200px}.about-story-columns{grid-template-columns:1fr;gap:24px;margin-top:32px}.about-purpose-grid{grid-template-columns:1fr;margin-top:32px}.about-purpose-grid article{padding:28px 0}.about-purpose-grid article+article{border-left:0;border-top:1px solid var(--ui-line);padding:28px 0 0}.about-founder-grid{grid-template-columns:1fr;gap:36px;margin-top:36px}.about-founder-grid h3{font-size:30px!important}.about-recognition-list{margin-top:32px}.about-recognition-list article{grid-template-columns:1fr;gap:14px;padding-block:26px}.about-recognition-list h3{font-size:25px!important}.about-source{grid-column:1}.about-next h2 br{display:none}}
@media(max-width:360px){.about-page main h1{font-size:42px}.about-page main h2{font-size:32px}.about-hero-foundation>div{grid-template-columns:1fr;gap:12px}.about-context-images img{height:180px}}
@media(prefers-reduced-motion:reduce){.about-page .about-button{transition:none;transform:none!important}}
