/* Theme switch button, shown in both themes. It pulses until the visitor has used it once. */
.th-tg{flex:none;width:44px;height:44px;padding:0;border-radius:50%;display:grid;place-items:center;border:2px solid #F26B1D;background:rgba(242,107,29,.14);color:#FF9A5A;cursor:pointer;animation:thPulse 2.2s ease-in-out infinite;transition:background .15s,transform .15s}
.th-tg:hover{background:#F26B1D;color:#1A1D21;transform:translateY(-1px)}
.th-tg:focus-visible{outline:2px solid #F26B1D;outline-offset:3px}
.th-tg.used{animation:none;border-width:1px}
.th-tg svg{display:block}
.th-tg .moon{display:none}
html[data-theme=light] .th-tg{background:#FFF1E7;color:#C2410C}
html[data-theme=light] .th-tg:hover{background:#F26B1D;color:#1A1D21}
html[data-theme=light] .th-tg .sun{display:none}
html[data-theme=light] .th-tg .moon{display:block}
@keyframes thPulse{0%,100%{box-shadow:0 0 0 0 rgba(242,107,29,.55)}50%{box-shadow:0 0 0 8px rgba(242,107,29,0)}}

/* Bright theme: tokens */
html[data-theme=light]{color-scheme:light}
html[data-theme=light]:root:not(#x){--bg:#FBF9F5;--surface:#FFFFFF;--ink:#1F2328;--muted:#5E5A54;--line:#E2DDD4;--deep:#FBF9F5;--deep-2:#FFFFFF;--deep-ink:#1F2328;--deep-muted:#5E5A54;--paper:#EEF2F6;--paper-grid:#C9D5E2;--bp:#1D4F91;--orange:#C2410C;--orange-soft:#FBE3D3;--green:#C2410C;--green-2:#C2410C;--green-soft:#FBE3D3;--green-ink:#FFFFFF;--red:#B91C1C;--amber:#B45309;--ok:#15803D;--c1:#F26B1D;--c2:#D9901A;--c3:#3F7CAC;--c4:#8A8579;--c5:#B85C38;--c6:#6B7280}
html[data-theme=light] body::before{background:#FBF9F5}

/* Bright theme: top bar */
html[data-theme=light] .nav{background:rgba(255,255,255,.95);border-bottom-color:#E2DDD4}
html[data-theme=light] .brand .bs{color:#1F2328}
html[data-theme=light] .brand svg{box-shadow:0 0 0 1px rgba(31,35,40,.12)}
html[data-theme=light] .links a{color:#3F444B}
html[data-theme=light] .links a:hover{color:#1F2328;background:rgba(31,35,40,.06)}
html[data-theme=light] .links a.on{color:#C2410C}
html[data-theme=light] .menu-btn{background:#fff;border-color:#D8D3CB;color:#1F2328}
html[data-theme=light] .acct summary{border-color:#D8D3CB;background:#fff;color:#1F2328}
html[data-theme=light] .acct-menu a:hover,html[data-theme=light] .gal-links a{color:#C2410C}
@media (min-width:1321px){html[data-theme=light] .links{border-color:#E2DDD4;background:#F6F3EE}}
@media (max-width:1320px){html[data-theme=light] .links{background:#fff;border-color:#E2DDD4}html[data-theme=light] .links a{color:#1F2328;border-color:#E2DDD4}html[data-theme=light] .links a.m-only{color:#C2410C}}

/* Bright theme: hero */
html[data-theme=light] .hero{color:#1F2328;background:radial-gradient(760px 460px at 88% 8%,rgba(242,107,29,.13),transparent 60%),linear-gradient(160deg,#FFFFFF 0%,#FBF9F5 55%,#F4EFE7 100%)}
html[data-theme=light] .hero h1,html[data-theme=light] .hero .lead,html[data-theme=light] .hero .lead b,html[data-theme=light] .hero .lead .co,html[data-theme=light] .ticker b,html[data-theme=light] .hero .band .k b{color:#1F2328}
html[data-theme=light] .hero h1 em,html[data-theme=light] .hero .eyebrow,html[data-theme=light] .ticker small{color:#C2410C}
html[data-theme=light] .hero .btn-g{background:#fff;border-color:#D8D3CB;color:#1F2328}
html[data-theme=light] .hero .frame{border-color:#E2DDD4;box-shadow:0 30px 70px -36px rgba(31,35,40,.45),0 0 0 6px rgba(31,35,40,.03)}
html[data-theme=light] .skyline path:first-child{fill:rgba(31,35,40,.04)}
html[data-theme=light] .hero .band .wrap{background:#fff;border-color:#E2DDD4;box-shadow:0 18px 40px -28px rgba(31,35,40,.4)}
html[data-theme=light] .hero .band .k{border-left-color:#E2DDD4}
html[data-theme=light] .dots i{background:rgba(31,35,40,.2)}
html[data-theme=light] .dots i.on{background:#F26B1D}

/* Bright theme: sections and cards */
html[data-theme=light] .white,html[data-theme=light] .dark,html[data-theme=light] section.white:not(.light){background:#FBF9F5}
html[data-theme=light] #team{background:linear-gradient(160deg,#FFFFFF,#F4EFE7)}
html[data-theme=light] .founder{background:linear-gradient(135deg,#FFFFFF,#F6F1E9);border-color:#E2DDD4}
html[data-theme=light] .card{box-shadow:0 1px 2px rgba(31,35,40,.06),0 20px 44px -30px rgba(31,35,40,.4)}
html[data-theme=light] .mem{background:#fff;border-color:#E2DDD4}
html[data-theme=light] .mem .ic{background:#FFF1E7;color:#C2410C;border-color:#F4D5C0}
html[data-theme=light] .mem:first-child .ic{background:#F26B1D;color:#1A1D21}
html[data-theme=light] .mem .who,html[data-theme=light] .dark .eyebrow{color:#B45309}
html[data-theme=light] .seg button[aria-pressed="true"]{background:#fff}

/* Bright theme: the footer stays dark, so it keeps the dark tokens */
/* (footer.dark rule below wins over the .dark band) */
html[data-theme=light] footer.dark{--ink:#F1EFEC;--muted:#B5B1AA;--line:#3A4048;--deep-ink:#F1EFEC;--deep-muted:#B5B1AA;background:linear-gradient(160deg,#1A1D21,#24292F)}

/* Bright theme: colours that were fixed for the dark look */
html[data-theme=light] .brand .bn{color:#C2410C}
html[data-theme=light] .ticker span,html[data-theme=light] .hero .band .k span{color:#5E5A54}
html[data-theme=light] .founder h3,html[data-theme=light] .founder p,html[data-theme=light] .mem h3{color:#1F2328}
html[data-theme=light] .founder p{color:#5E5A54}
html[data-theme=light] .founder .av{background:#F26B1D;color:#1A1D21}
html[data-theme=light] .founder .reg{background:#FFF1E7;color:#1F2328}
html[data-theme=light] .founder .reg b{color:#C2410C}
html[data-theme=light] .mem .chips span{background:#F1EDE6;color:#3F444B}
html[data-theme=light] .frame .toggle{background:#fff;border-color:#D8D3CB}
html[data-theme=light] .frame .toggle button{color:#1F2328}
html[data-theme=light] .frame .tag{background:#fff;color:#1D4F91;border-color:#C9D5E2}
html[data-theme=light] .contact .pn .pl.c{background:#C2410C}
html[data-theme=light] .contact .pn .pl.w{background:#15803D}

/* Keep the switch beside Sign in, not beside the logo */
@media (max-width:1320px){.th-tg{margin-left:auto}.th-tg~.acct{margin-left:0}}
html[data-theme=light] footer h3{color:#FF9A5A}
html[data-theme=light] footer{--red:#ff6b6b}
html[data-theme=light] .frame .toggle button[aria-pressed="true"]{background:#F26B1D;color:#1A1D21}

/* Phones: fit the switch in the top bar without pushing the menu button off screen */
@media (max-width:420px){
  .nav .wrap{gap:4px}
  .nav .th-tg,.nav .acct summary,.nav .menu-btn{width:40px;height:40px}
  .nav .qbtn{padding-inline:12px}
}
@media (max-width:356px){.nav .brand .bn{display:none}}

/* Wide screens: the switch takes its space from the quote label, so every top bar link stays fully visible */
@media (min-width:1321px){
  .nav .wrap{gap:10px}
  .nav .qbtn .q-l{display:none}
  .nav .qbtn .q-s{display:inline}
}
@media (min-width:1321px) and (max-width:1360px){.nav .links a{padding-inline:5px}}

/* Bright theme: orange buttons keep the bright brand orange so their dark label stays readable */
html[data-theme=light] .btn:not(.btn-g):not(.btn-r),html[data-theme=light] .tabs button[aria-selected=true]{background:#F26B1D;border-color:#F26B1D;color:#1A1D21}
html[data-theme=light] .btn:not(.btn-g):not(.btn-r):hover{background:#FF7F33}
html[data-theme=light] .qbtn .count{background:#1F2328;color:#fff}
html[data-theme=light] .tabs .n{background:#F4B942}
