@import url('./brand-tokens.css');
/* Shared identity for the website, product introduction and reference pages. */
:root{--ink:var(--brand-ink);--muted:var(--brand-muted);--paper:var(--brand-white);--line:var(--brand-line);--green:var(--brand-theme);--lime:var(--brand-base)}
body{background:var(--brand-white)}
a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible{outline-color:var(--brand-orange)}
.brand{display:inline-flex;align-items:center;gap:12px}
.brand-logo{display:block;width:44px;height:45px;object-fit:contain;flex-shrink:0}
.brand:not(:has(.brand-logo)):before{content:'';display:block;width:40px;height:41px;flex-shrink:0;background:url('./logo.svg') center/contain no-repeat}
.header{border-color:var(--brand-line)}
.header .brand{color:var(--brand-theme)}
.header .nav-demo{background:var(--brand-base);color:var(--brand-theme)}
.header .language{background:var(--brand-white);border-color:var(--brand-shadow)}
.hero h1,.connection h2{color:var(--brand-theme)}
h1 em{color:var(--brand-theme)}
.eyebrow{color:var(--brand-muted)}
.eyebrow>span{color:var(--brand-orange)}
.button{background:var(--brand-theme);border-color:var(--brand-theme);color:var(--brand-white)}
.button:hover{background:var(--brand-deep)}
.module-card{--card-bg:var(--brand-base);--card-color:var(--brand-theme);background:var(--brand-white);border-color:var(--brand-line)}
.module-stars{--card-bg:var(--brand-surface);--card-color:var(--brand-theme)}
.module-airport{--card-bg:var(--brand-warm);--card-color:var(--brand-warm-ink)}
.module-journal{--card-bg:var(--brand-base);--card-color:var(--brand-theme)}
.module-card:hover{border-color:var(--brand-shadow);box-shadow:0 10px 26px #A7D6D92B}
.module-open{background:var(--brand-white);color:var(--brand-theme)}
.connection{background:var(--brand-surface);border:1px solid var(--brand-line)}
.connection-steps article>span{background:var(--brand-base);color:var(--brand-theme)}
.caption-star{color:var(--brand-orange)}
.footer{border-color:var(--brand-line)}
@media(max-width:760px){.brand{gap:9px}.brand-logo{width:38px;height:39px}.brand:not(:has(.brand-logo)):before{width:34px;height:35px}}
