/* Home header and footer: the same look as the header inside the Inner Lodge (lodge/lodge.css .topbar). */
:root{--talosha-header-h:64px}
.hc-top{position:fixed;inset:0 0 auto;z-index:2147483000;height:64px;transition:transform .45s cubic-bezier(.23,1,.32,1);background:rgba(5,8,11,.85);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid #1d2831}
.hc-top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(220,192,154,.33) 30%,rgba(220,192,154,.33) 70%,transparent);pointer-events:none}
.hc-inner{max-width:1400px;margin:0 auto;height:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:0 24px}
.hc-brand{display:flex;align-items:center;gap:12px;width:max-content;color:#f2f1ea;text-decoration:none}
.hc-brand img{width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(220,192,154,.3))}
.hc-word{font:400 22px/1 'Bodoni Moda',Georgia,serif;letter-spacing:-.02em;white-space:nowrap}.hc-word small{display:block;font:600 9px/1.6 'Manrope',sans-serif;letter-spacing:.32em;text-transform:uppercase;color:#dcc09a}
.hc-links{display:flex;gap:6px;justify-self:center}
.hc-links a{padding:9px 16px;border-radius:999px;color:#9eaeb9;font:600 14px/1 'Manrope',sans-serif;text-decoration:none;transition:color .16s ease,background-color .16s ease}
.hc-right{display:flex;align-items:center;gap:10px;justify-self:end}
.hc-btn{display:inline-flex;align-items:center;min-height:40px;padding:0 18px;border-radius:999px;border:1px solid #e5ccb0;background:linear-gradient(180deg,#f0e1c8,#e1caa6);color:#1d211f;font:700 13.5px/1 'Manrope',sans-serif;text-decoration:none;white-space:nowrap}
.hc-acct{display:grid;place-items:center;padding:2px;border:1px solid rgba(220,192,154,.33);border-radius:50%}
.hc-av{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;object-fit:cover;background:radial-gradient(circle at 30% 25%,#1d2b37,#0d161e);color:#c5d2d8;font:400 14px/1 'Bodoni Moda',Georgia,serif}
.hc-out{color:#9eaeb9;font:600 13px/1 'Manrope',sans-serif;text-decoration:none;padding:8px 6px}
.hc-foot{position:relative;margin-top:40px;border-top:1px solid #1d2831;background:linear-gradient(180deg,rgba(6,9,13,0),#06090d 40%)}
.hc-foot::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(220,192,154,.3) 30%,rgba(220,192,154,.3) 70%,transparent)}
.hc-foot-inner{max-width:1400px;margin:0 auto;padding:56px 24px 32px;display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:36px 48px}
.hc-foot-brand p{margin:14px 0 0;max-width:34ch;color:#9eaeb9;font:400 14px/1.7 'Manrope',sans-serif}
.hc-foot-col{display:grid;gap:10px;align-content:start}
.hc-foot-col b{font:600 10px/1.6 'Manrope',sans-serif;letter-spacing:.26em;text-transform:uppercase;color:#dcc09a;margin-bottom:4px}
.hc-foot-col a,.hc-link{color:#c5d2d8;font:400 14px/1.4 'Manrope',sans-serif;text-decoration:none;background:none;border:0;padding:0;text-align:left;cursor:pointer;width:max-content}
.hc-copy{grid-column:1/-1;margin:12px 0 0;padding-top:20px;border-top:1px solid #1d2831;color:#7c8c97;font:400 12px/1.5 'Manrope',sans-serif}
@media (hover:hover) and (pointer:fine){.hc-links a:hover,.hc-out:hover{color:#f2f1ea;background:rgba(197,210,216,.06)}.hc-foot-col a:hover,.hc-link:hover{color:#f2f1ea}.hc-acct:hover{border-color:#dcc09a}}
@media (max-width:980px){.hc-links{display:none}.hc-inner{grid-template-columns:1fr auto}.hc-foot-inner{grid-template-columns:1fr 1fr}.hc-foot-brand{grid-column:1/-1}}
@media (max-width:560px){.hc-out{display:none}.hc-word{font-size:19px}.hc-inner{padding:0 14px}.hc-btn{padding:0 14px}}

.hc-top.hc-hidden{transform:translateY(-101%)}
@media (prefers-reduced-motion:reduce){.hc-top{transition:none}}

/* Sections flow into each other: each one starts in the colour the previous one ends with, and fades into the next.
   Order on the page: hero (photo, ends #080e14) -> recognition (paper) -> circle (night) -> marks -> oracle -> invitation -> footer. */
.recognition{background:linear-gradient(180deg,#080e14 0,#0f181f 60px,#26313a 150px,#5d696d 240px,#a9b3b2 320px,var(--paper,#dce2df) 400px,var(--paper,#dce2df) calc(100% - 240px),#4a5559 calc(100% - 100px),#101c26 100%);padding-top:380px;padding-bottom:260px}
.circle-section{background:linear-gradient(180deg,#101c26 0,#101c26 calc(100% - 260px),#0c1720 100%)}
.marks{position:relative;isolation:isolate}
.marks::before{content:'';position:absolute;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);z-index:-1;background:linear-gradient(180deg,#0c1720 0,#0b151d 55%,#0a1219 100%)}
html,body{overflow-x:clip}
.oracle-section{background:linear-gradient(180deg,#0a1219 0,#0a1219 60%,#090f14 100%)}
.invitation{background:#090f14}
.hc-foot{margin-top:0;background:linear-gradient(180deg,#090f14 0,#06090d 60%)}
@media (max-width:700px){.recognition{padding-top:260px;padding-bottom:200px;background:linear-gradient(180deg,#080e14 0,#111a21 45px,#2b363e 110px,#66726f 175px,#aab4b3 235px,var(--paper,#dce2df) 290px,var(--paper,#dce2df) calc(100% - 180px),#4a5559 calc(100% - 80px),#101c26 100%)}}
/* the photo's shade ends in exactly the colour the next section starts with, so there is no seam */
.scene-shade{background:linear-gradient(180deg,#050b11bb 0%,#080f1750 38%,transparent 58%,#080e14d9 86%,#080e14 100%)!important}