/* Spirit-Walker Motel: black and gold, golden crosses, neon sign, robot team. Loaded after the page's own styles. */
@font-face{font-family:"Cinzel";src:url(fonts/Cinzel.woff2) format("woff2");font-weight:400 900;font-display:swap}
.plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:14px 0 22px}
.plan{text-align:center}.plan h4{margin:0 0 6px}.plan .price{font-size:1.5rem;margin:4px 0}.plan .price small{font-size:.8rem;opacity:.8}
@font-face{font-family:"Great Vibes";src:url(fonts/GreatVibes-400.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--ink:#030203;--ink-2:#0a0707;--panel:#0b0808;--line:rgba(232,192,90,.32);--line-hi:rgba(232,192,90,.7);--gold:#e8c05a;--gold-hi:#fff0b8;--gold-lo:#a87820;--disp:"Cinzel","Trajan Pro",Georgia,serif;--script:"Great Vibes","Brush Script MT","Segoe Script",cursive}
html{scroll-behavior:smooth;scroll-padding-top:64px}
body{background:var(--ink)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cross{display:inline-block;width:30px;height:40px;flex:none;filter:drop-shadow(0 0 6px rgba(232,192,90,.45))}
.eyebrow,.orn{margin:0 0 10px;letter-spacing:.38em;text-transform:uppercase;font-size:.7rem;color:var(--gold)}
.orn{text-align:center;margin-bottom:6px}
.orn .cross{width:38px;height:51px;filter:drop-shadow(0 0 10px rgba(232,192,90,.6))}
.center{text-align:center;margin-top:28px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* Gold display type */
h1,h2,h3,.name{font-family:var(--disp);font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:linear-gradient(180deg,var(--gold-hi),var(--gold) 52%,var(--gold-lo));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--gold)}
h4{font-family:var(--disp);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0 0 6px;font-size:.9rem}
.script{font-family:var(--script);font-size:clamp(2rem,6vw,3.6rem);line-height:1.1;margin:0;color:#f6d77e;text-shadow:0 0 20px rgba(240,190,70,.45)}
.script.small{font-size:clamp(1.5rem,4vw,2.2rem)}
.muted{color:#cbbf9f}

.banner{background:#0a0706;color:var(--gold-hi);border-bottom:1px solid var(--line);letter-spacing:.04em}
.banner a{color:var(--gold-hi)}

/* Navigation */
.topnav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px clamp(14px,4vw,44px);background:rgba(3,2,3,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;color:var(--gold-hi);text-decoration:none;font-family:var(--disp);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.95rem;white-space:nowrap}
.brand .cross{width:26px;height:35px}
.brand small{display:block;font-size:.55rem;letter-spacing:.7em;color:#ff4d4d;margin-top:2px;text-shadow:0 0 8px rgba(255,60,60,.6)}
.links{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.links::-webkit-scrollbar{display:none}
.links a{color:#d9ccaa;text-decoration:none;font-family:var(--disp);text-transform:uppercase;letter-spacing:.16em;font-size:.68rem;padding:12px 10px;white-space:nowrap}
.links a:hover{color:var(--gold-hi)}

/* Hero: the neon sign over the lit-up motel */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:min(94vh,900px);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:20px;padding:36px clamp(14px,6vw,96px) 32px;text-align:center;background:#030203}
.hero-bg{position:absolute;left:0;right:0;bottom:0;height:66%;z-index:-1;background:url(img/building.jpg) center bottom/cover no-repeat;filter:saturate(1.2) brightness(.92);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 42%);mask-image:linear-gradient(180deg,transparent 0,#000 42%)}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(3,2,3,.55) 0,rgba(3,2,3,0) 30%,rgba(3,2,3,.1) 60%,rgba(3,2,3,.92) 100%)}
.hero-sign{width:min(640px,88vw);height:auto;margin:6px 0 auto;-webkit-mask-image:radial-gradient(ellipse 50% 54% at 50% 50%,#000 46%,transparent 100%);mask-image:radial-gradient(ellipse 50% 54% at 50% 50%,#000 46%,transparent 100%);filter:drop-shadow(0 0 30px rgba(255,185,60,.35))}
.hero-copy{max-width:860px}
.strap{margin:12px 0 0;letter-spacing:.34em;text-transform:uppercase;font-size:.72rem;color:var(--gold);background:rgba(3,2,3,.55);display:inline-block;padding:6px 16px;border-radius:4px}
.strap i{font-style:normal;margin:0 .5em;color:var(--gold-hi)}
.bookbar{width:min(1000px,100%);display:grid;grid-template-columns:1.2fr .8fr 1.2fr auto;background:rgba(3,2,3,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line-hi);border-radius:12px;overflow:hidden;box-shadow:0 0 30px rgba(232,192,90,.2)}
.bookbar label{display:flex;flex-direction:column;gap:6px;padding:14px 20px;border-right:1px solid var(--line);font-family:var(--disp);font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);text-align:left}
.bookbar input,.bookbar select{background:transparent;border:0;padding:0;min-height:0;font:inherit;font-family:var(--sans);font-size:1.05rem;letter-spacing:0;text-transform:none;color:var(--ivory-100);color-scheme:dark;box-shadow:none}
.bookbar select option{background:#0b0808}
.bookbar .btn{align-self:stretch;border-radius:0;padding:0 40px}

/* Sections */
.band{padding:clamp(52px,8vw,100px) clamp(14px,6vw,96px);background:var(--ink)}
.band.dark{background:linear-gradient(180deg,#000,#0a0707 50%,#000)}
.sec-head{text-align:center;max-width:760px;margin:0 auto 32px}
.sec-head h2{font-size:clamp(1.7rem,4.6vw,3rem);margin:0 0 10px}
.sec-head h3{font-size:1.4rem;margin:0}
.sec-head.left{text-align:left;margin:0 0 16px}
.pill{display:inline-flex;align-items:center;gap:10px;margin-top:6px;padding:7px 16px;border:1px solid var(--line);border-radius:999px;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#cbbf9f}
.pill::before{content:"";width:8px;height:8px;border-radius:50%;background:#7a7a7a}
.pill.on{color:#b7ecd6;border-color:rgba(78,159,125,.6)}
.pill.on::before{background:#4e9f7d;box-shadow:0 0 9px #4e9f7d}
.wrap{max-width:900px;padding:0 clamp(14px,4vw,32px) 72px;gap:18px}
.wrap>.sec-head{margin-top:64px;margin-bottom:8px}
.wrap>.sec-head:first-child{margin-top:48px}

/* Glowing gold frames, like the flyer */
.card,.room-card,.feature,.draw,.bot,.book-panel,.trio,.key-box{border:1px solid var(--line-hi);border-radius:12px;background:var(--panel);box-shadow:0 0 22px rgba(232,192,90,.14),inset 0 0 0 1px rgba(0,0,0,.7)}
.assist{border-color:var(--gold);box-shadow:0 0 36px rgba(232,192,90,.22)}

/* Rooms */
.room-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;max-width:1240px;margin:0 auto}
.room-card{display:flex;flex-direction:column;overflow:hidden;transition:transform .3s,box-shadow .3s}
.room-card:hover{transform:translateY(-4px);box-shadow:0 0 34px rgba(232,192,90,.35)}
.room-card.on{border-color:var(--gold-hi);box-shadow:0 0 0 1px var(--gold),0 0 40px rgba(232,192,90,.4)}
.room-card.sold{opacity:.5}
.room-card.dim{opacity:.45}
.room-art{aspect-ratio:16/10;overflow:hidden;border-bottom:1px solid var(--line)}
.room-art svg{display:block;width:100%;height:100%}
.room-body{display:flex;flex-direction:column;gap:8px;padding:20px;flex:1}
.room-body h3{font-size:1.25rem;margin:0}
.room-body .desc{margin:0;color:#d9ccaa;font-size:.9rem;line-height:1.5;flex:1}
.price b{font-family:var(--disp);font-size:1.8rem;font-weight:700;color:var(--gold-hi)}
.price span{margin-left:8px;color:#cbbf9f;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase}
.room-body .muted{margin:0}
@media (prefers-reduced-motion:reduce){.room-card{transition:none}.room-card:hover{transform:none}}
.book-panel{max-width:760px;margin:40px auto 0;padding:clamp(18px,4vw,36px)}
.done .conf{font-family:var(--disp);font-size:2rem;color:var(--gold-hi);margin:4px 0}
.done .code{font-size:1.9rem;letter-spacing:.35em;color:var(--ivory-100);margin:4px 0}
.done{background:rgba(78,159,125,.08);border:1px solid rgba(78,159,125,.55);padding:22px;border-radius:12px}

/* Kitchen */
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;max-width:1100px;margin:0 auto}
.feature{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;align-items:stretch}
.feature-text{padding:22px}
.feature h3{font-size:1.25rem;margin:0 0 4px}
.hours{font-family:var(--disp);font-size:1.05rem;letter-spacing:.1em;color:var(--gold-hi);margin:0 0 8px}
.feature-text p:last-child{margin:0;color:#d9ccaa;font-size:.92rem}
.feature img{width:100%;height:100%;object-fit:cover;display:block;min-height:150px}
.trio{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));max-width:1100px;margin:22px auto 0;overflow:hidden}
.trio>div{padding:18px 20px;border-right:1px solid var(--line)}
.trio>div:last-child{border-right:0}
.trio p{margin:0;color:#d9ccaa;font-size:.9rem;line-height:1.6}

/* Membership */
.checks{list-style:none;margin:0 auto 26px;padding:0;max-width:640px;display:grid;gap:10px}
.checks li{padding-left:34px;position:relative;color:#eadfbe}
.checks li::before{content:"\2713";position:absolute;left:0;top:-2px;width:24px;height:24px;border:2px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;color:var(--gold-hi)}
.plaque{display:table;margin:0 auto 22px;padding:10px 38px;border:2px solid var(--gold);border-radius:10px;font-size:clamp(1.1rem,3vw,1.7rem);box-shadow:0 0 22px rgba(232,192,90,.3)}
.draw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;max-width:1000px;margin:0 auto}
.draw{overflow:hidden;text-align:center;padding-bottom:18px}
.draw img{width:100%;height:150px;object-fit:cover;display:block;margin-bottom:10px}
.draw .cross{width:28px;height:37px;margin-top:-30px;position:relative;filter:drop-shadow(0 0 8px rgba(0,0,0,.8))}
.draw h4{font-size:1.05rem;margin-top:6px}
.draw p{margin:0 14px;color:#d9ccaa;font-size:.9rem}

/* Robot team */
.bot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:20px;max-width:1100px;margin:0 auto}
.bot{overflow:hidden;text-align:center;padding-bottom:18px}
.bot img{width:100%;aspect-ratio:166/196;object-fit:cover;display:block;margin-bottom:12px;border-bottom:1px solid var(--line)}
.bot h3{font-size:1.5rem;margin:0}
.role{margin:4px 0 10px;font-family:var(--disp);letter-spacing:.12em;text-transform:uppercase;font-size:.7rem;color:var(--gold)}
.bot ul{list-style:none;margin:0;padding:0 14px;color:#d9ccaa;font-size:.88rem;line-height:1.7}
.bot li::before{content:"\2022";color:var(--gold);margin-right:8px}

/* Controls */
.btn{border-radius:8px;font-family:var(--disp);text-transform:uppercase;letter-spacing:.14em;font-size:.74rem;font-weight:700;padding:14px 26px;background:transparent;border:1px solid var(--gold);color:var(--gold-hi);box-shadow:none}
.btn:hover{background:rgba(232,192,90,.14);filter:none}
.btn.gold{background:linear-gradient(180deg,#fff0b8,#e0b44c 55%,#a87820);color:#1a0f02;border-color:#fff0b8;box-shadow:0 0 18px rgba(232,192,90,.35)}
.btn.gold:hover{filter:brightness(1.08);background:linear-gradient(180deg,#fff0b8,#e0b44c 55%,#a87820)}
.btn.ghost{border-color:var(--line);color:#d9ccaa;padding:12px 20px}
.btn.live{background:linear-gradient(180deg,#4e9f7d,#2f6b52);color:#fff;border-color:#b7ecd6}
input,select,textarea{border-radius:8px;background:#070505;border:1px solid var(--line)}
input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:none;box-shadow:0 0 0 2px var(--gold)}
.tabs{border-radius:10px;border:1px solid var(--line);background:#070505}
.tabs button{font-family:var(--disp);text-transform:uppercase;letter-spacing:.12em;font-size:.7rem}
.tabs button.on{background:linear-gradient(180deg,#fff0b8,#e0b44c);color:#1a0f02}
.msg{border-radius:10px}
.msg.belle{background:#14100a;border:1px solid var(--line-hi)}
.msg.you{background:#2a0d12;border:1px solid rgba(232,192,90,.35)}
.q{border-radius:999px;border:1px solid var(--line-hi);font-size:.72rem}
.q.gold{background:var(--gold);color:#1a0f02;border-color:var(--gold)}
.chip{border-radius:999px}
.emergency{border-radius:10px}
.ahead h2{font-size:1.4rem}
.avatar{background:#000 url(img/belle.jpg) center top/cover no-repeat;color:transparent;font-size:0;border:2px solid var(--gold);box-shadow:0 0 18px rgba(232,192,90,.45)}
.key-box{padding:16px;margin-bottom:18px;background:rgba(232,192,90,.05)}
.key-box h3{margin:0 0 6px;font-size:1.1rem}

/* Contact and motto */
.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px;padding:52px clamp(14px,6vw,96px);background:#000;border-top:1px solid var(--line)}
.contact p{margin:0}
.motto{display:flex;align-items:center;justify-content:center;gap:clamp(8px,2.6vw,30px);padding:22px 12px calc(22px + env(safe-area-inset-bottom));background:#000;border-top:2px solid var(--gold);font-family:var(--disp);font-weight:500;letter-spacing:.4em;text-transform:uppercase;color:var(--gold);font-size:clamp(.78rem,2.8vw,1.7rem);box-shadow:0 -10px 40px rgba(232,192,90,.12)}
.motto i{font-style:normal;color:var(--gold-hi)}
.motto .cross{width:clamp(26px,4.5vw,42px);height:clamp(35px,6vw,56px)}

/* Welcome splash */
.splash{background:radial-gradient(ellipse at 50% 28%,#3a2a0a 0%,#0c0805 48%,#000 100%)}
.splash h1{font-size:clamp(1.8rem,6vw,3rem)}

/* Phones */
html.is-mobile .topnav{padding:6px 10px}
html.is-mobile .brand{font-size:.78rem;letter-spacing:.14em}
html.is-mobile .brand .cross{width:22px;height:30px}
html.is-mobile .links a{padding:12px 8px;letter-spacing:.1em;font-size:.62rem}
html.is-mobile .hero{min-height:0;padding:20px 14px 18px;gap:16px}
html.is-mobile .hero-bg{height:52%}
html.is-mobile .hero-sign{width:94vw}
html.is-mobile .strap{letter-spacing:.14em;font-size:.58rem;padding:5px 10px}
html.is-mobile .bookbar{grid-template-columns:1fr 1fr}
html.is-mobile .bookbar label{padding:12px 14px;border-bottom:1px solid var(--line)}
html.is-mobile .bookbar label:nth-child(2){border-right:0}
html.is-mobile .bookbar label:nth-child(3){grid-column:1/-1;border-right:0}
html.is-mobile .bookbar .btn{grid-column:1/-1;padding:18px;min-height:56px}
html.is-mobile .bookbar input,html.is-mobile .bookbar select{font-size:16px;min-height:28px}
html.is-mobile .band{padding:44px 14px}
html.is-mobile .room-grid,html.is-mobile .feature-grid{grid-template-columns:1fr}
html.is-mobile .feature{grid-template-columns:1fr}
html.is-mobile .feature img{height:140px}
html.is-mobile .bot-grid{grid-template-columns:1fr 1fr;gap:12px}
html.is-mobile .bot h3{font-size:1.15rem}
html.is-mobile .bot ul{font-size:.8rem;padding:0 8px}
html.is-mobile .draw-grid{grid-template-columns:1fr}
html.is-mobile .trio>div{border-right:0;border-bottom:1px solid var(--line)}
html.is-mobile .two{grid-template-columns:1fr}
html.is-mobile .contact{padding:40px 14px;grid-template-columns:1fr 1fr}
html.is-mobile .book-panel{padding:18px 14px}
html.is-mobile .wrap{padding:0 12px calc(40px + env(safe-area-inset-bottom))}
html.is-mobile .motto{letter-spacing:.14em;font-size:.7rem;gap:8px}

/* The install button is injected with inline styles, so it needs !important to sit low and small. */
button[style*="fixed"]{bottom:calc(14px + env(safe-area-inset-bottom))!important;padding:8px 12px!important;font-size:.72rem!important;letter-spacing:.1em;text-transform:uppercase;border-radius:8px!important}

/* Need service? */
.svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.svc-card{display:flex;align-items:center;gap:14px;text-align:left;padding:12px;border:1px solid var(--line-hi);border-radius:14px;background:linear-gradient(180deg,#140d0d,#070505);color:var(--ivory-100,#f6efe0);cursor:pointer;font:inherit;box-shadow:0 0 22px rgba(232,192,90,.14);transition:box-shadow .2s,border-color .2s}
.svc-card:hover,.svc-card:focus-visible{border-color:var(--gold);box-shadow:0 0 32px rgba(232,192,90,.45)}
.svc-card img{width:84px;height:100px;object-fit:cover;object-position:center 15%;border-radius:10px;border:1px solid var(--line-hi);flex:none}
.svc-card .name{display:block;font-size:1.02rem;letter-spacing:.03em;margin-bottom:4px;overflow-wrap:anywhere}
.svc-card>span{min-width:0}
.svc-card small{display:block;color:var(--muted);font-size:.86rem;line-height:1.4}
.svc-panel{margin-top:16px;scroll-margin-top:80px}
.svc-panel h3{margin:0 0 10px;font-size:1.2rem}
.slip{text-align:center;border:2px dashed var(--line-hi);border-radius:14px;padding:18px 14px}
.slip .row{justify-content:center}
@media (max-width:560px){.svc{grid-template-columns:1fr}}
.form .hidden{display:none}