/* Tribalys Ghent – design G layer for all sub pages. Loaded after each page's own styles. */
@import url(/assets/tb-fonts.css);

:root{
  --bg-dark:#17120E; --bg-card:rgba(34,26,21,.94); --bg-card-hover:#2B221C;
  --accent-warm:#A3B98F; --accent-gold:#D9B27C; --accent-terracotta:#A65A38; --accent-sage:#A3B98F;
  --text-light:#F2E8DA; --text-muted:#B8A999; --border-glass:#3A2F27; --border-accent:rgba(217,178,124,.35);
  --font-serif:'Cormorant Garamond',Georgia,serif; --font-heading:'Cormorant Garamond',Georgia,serif; --font-sans:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
  --g-esp:#17120E; --g-walnut:#221A15; --g-line:#3A2F27; --g-line2:#5A4838; --g-cream:#F2E8DA; --g-cream2:#E6DACA; --g-muted:#B8A999;
  --g-gold:#D9B27C; --g-sage:#A3B98F; --g-sage2:#C3D4B2; --g-moss:#4F5B3A;
  --g-gutter:clamp(16px,4vw,56px);
}
html,body{background:var(--g-esp)!important;color:var(--g-cream)}
body{font-family:var(--font-sans)}
body:has(.g-head){padding-top:0!important}
::selection{background:var(--g-gold);color:var(--g-esp)}
:focus-visible{outline:2px solid var(--g-gold);outline-offset:3px}
h1,h2,h3{font-family:var(--font-serif)!important;font-weight:500}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition:none!important}}
html.calm *{animation:none!important}

/* shared header */
.g-head{position:sticky;top:0;z-index:1000;background:rgba(23,18,14,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--g-line);font-family:var(--font-sans)}
.g-head-row{max-width:1280px;margin:0 auto;padding:0 var(--g-gutter);height:80px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.g-logo{font-family:var(--font-serif);font-size:28px;font-weight:600;letter-spacing:.12em;color:var(--g-cream)!important;text-decoration:none!important;white-space:nowrap;text-transform:none}
.g-logo em{color:var(--g-gold);font-weight:500;letter-spacing:.06em;font-style:italic}
.g-nav{display:flex;gap:30px;font-size:15px;font-weight:500}
.g-nav a{color:var(--g-cream)!important;text-decoration:none!important;opacity:1}
.g-nav a:hover,.g-nav a[aria-current=page]{color:var(--g-gold)!important}
.g-nav a.g-gold{color:var(--g-gold)!important}
.g-actions{display:flex;align-items:center;gap:12px}
.g-calm{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--g-line);background:transparent;color:var(--g-cream);font:500 14px var(--font-sans);cursor:pointer}
.g-calm svg{width:16px;height:16px;fill:none;stroke:var(--g-sage);stroke-width:1.8}
.g-calm .fill{fill:var(--g-sage)}
.g-calm[aria-pressed=true]{border-color:var(--g-sage);background:#2E3A28}
.g-cta{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--g-sage);color:var(--g-esp)!important;text-decoration:none!important;font:700 14px var(--font-sans)}
.g-cta:hover{background:var(--g-sage2)}
.g-burger{display:none;width:44px;height:44px;border-radius:999px;border:1px solid var(--g-line);background:transparent;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0}
.g-burger span{display:block;width:18px;height:1.5px;background:var(--g-cream)}
.g-drawer{border-top:1px solid var(--g-line);padding:12px var(--g-gutter) 24px;display:flex;flex-direction:column}
.g-drawer[hidden]{display:none}
.g-drawer a{color:var(--g-cream)!important;text-decoration:none;font-size:18px;padding:12px 0;border-bottom:1px solid var(--g-line)}
@media (max-width:900px){.g-nav,.g-cta{display:none}.g-burger{display:flex}}
@media (max-width:560px){.g-logo{font-size:22px}.g-calm span{display:none}.g-calm{width:44px;padding:0;justify-content:center}}

/* shared footer */
.g-foot{background:#100C09;padding:clamp(56px,7vw,88px) 0 40px;margin-top:clamp(48px,6vw,80px);font-family:var(--font-sans);color:var(--g-muted)}
.g-foot-in{max-width:1280px;margin:0 auto;padding:0 var(--g-gutter)}
.g-foot-claim{font-family:var(--font-serif);font-size:clamp(34px,4.4vw,56px);line-height:1.05;max-width:980px;color:var(--g-cream);margin:0}
.g-foot-claim em{color:var(--g-gold)}
.g-foot-cols{display:grid;grid-template-columns:1.6fr 1fr 1.1fr 1.5fr;gap:32px;margin-top:48px;font-size:15px;line-height:1.9}
.g-foot-cols strong{color:var(--g-cream)}
.g-foot-cols a{color:var(--g-cream2)!important;text-decoration:none}
.g-foot-cols a:hover{color:var(--g-gold)!important}
.g-foot-legal{margin-top:40px;padding-top:20px;border-top:1px solid var(--g-line);font-size:13px;color:#8F8173}
.g-foot-legal a{color:inherit!important}
@media (max-width:900px){.g-foot-cols{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.g-foot-cols{grid-template-columns:1fr}}

/* legacy page chrome: portal headers keep their markup, get the G look */
.site-header{background:rgba(23,18,14,.94)!important;border-bottom:1px solid var(--g-line)!important;backdrop-filter:blur(8px)}
.site-header .brand-logo{font-family:var(--font-serif)!important;font-weight:600;letter-spacing:.12em;color:var(--g-cream)!important;text-transform:none}
.site-header .brand-logo span{color:var(--g-gold)!important;font-style:italic}
.mobile-nav-drawer,.nav-burger{display:none!important}

/* common legacy components mapped to G */
.badge-tag,.badge-pill,.vv-sub-badge,.vv-section-tag{background:transparent!important;border:1px solid var(--g-line)!important;color:var(--g-gold)!important;border-radius:999px}
a{color:var(--g-sage)}
input,select,textarea{accent-color:var(--g-sage)}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea{background-color:#120E0B;color:var(--g-cream);border-color:var(--g-line2)}
input:focus,select:focus,textarea:focus{border-color:var(--g-gold)!important;outline:none;box-shadow:none}
button[type=submit],.btn-submit,.btn-primary,.vv-btn-primary,.book-btn,.btn-book,.cta-btn,.btn-reserve,.hero-cta{background:var(--g-sage)!important;color:var(--g-esp)!important;border-color:var(--g-sage)!important}
button[type=submit]:hover,.btn-submit:hover,.btn-primary:hover,.vv-btn-primary:hover,.book-btn:hover,.btn-book:hover,.cta-btn:hover,.btn-reserve:hover{background:var(--g-sage2)!important}
html{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.gf-section,#map-of-practices,#guide{scroll-margin-top:96px}
.g-cta.g-cta-gold{background:transparent;border:1px solid var(--g-gold,#D9B27C);color:var(--g-gold,#D9B27C)!important}.g-cta.g-cta-gold:hover{background:var(--g-gold,#D9B27C);color:var(--g-esp,#17120E)!important}
.g-drawer a.g-gold{color:#D9B27C}

/* footer (shared by all pages) */
.tf{background:#100C09;color:#B8A999;padding:clamp(56px,7vw,88px) 0 36px;font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:15px;line-height:1.55}
.tf-in{max-width:1280px;margin:0 auto;padding:0 clamp(16px,4vw,56px)}
.tf a{color:#E6DACA;text-decoration:none}
.tf a:hover{color:#D9B27C}
.tf-claim{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:clamp(26px,3.4vw,48px);line-height:1.1;color:#F2E8DA;margin:0;white-space:nowrap}
.tf-claim em{color:#D9B27C}
.tf-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,.9fr);gap:clamp(24px,4vw,56px);margin-top:44px;align-items:start}
.tf-logo{font-family:'Cormorant Garamond',Georgia,serif;font-size:26px;letter-spacing:.18em;color:#F2E8DA!important}
.tf-logo em{letter-spacing:.02em;color:#D9B27C;font-style:italic}
.tf-sub{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:18px;line-height:1.35;color:#D9B27C;margin:8px 0 22px;max-width:340px}
.tf-block{margin-top:18px;display:flex;flex-direction:column;gap:8px}
.tf-label{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:#8F8173}
.tf-row{display:flex;gap:12px;align-items:flex-start;color:#E6DACA}
.tf-row svg{flex:0 0 18px;width:18px;height:18px;margin-top:2px;fill:none;stroke:#A3B98F;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tf-row b{color:#F2E8DA;font-weight:600}
.tf-row small{display:block;font-size:12px;color:#8F8173;letter-spacing:.02em}
.tf-founded{display:inline-flex;gap:10px;align-items:center;margin-top:24px;padding:9px 14px;border:1px solid #3A2F27;border-radius:999px;font-size:14px}
.tf-founded svg{width:16px;height:16px;fill:none;stroke:#D9B27C;stroke-width:1.6}
.tf-founded b{color:#F2E8DA;font-weight:600}
.tf-map{position:relative;border-radius:24px;overflow:hidden;border:1px solid #3A2F27;background:#1B1511;min-height:300px;height:100%}
.tf-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.35) contrast(.95)}
.tf-map-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px;background:radial-gradient(circle at 50% 40%,#2B221C,#1B1511 70%)}
.tf-map-ph svg{width:34px;height:34px;fill:none;stroke:#D9B27C;stroke-width:1.5}
.tf-map-ph p{color:#E6DACA;margin:0}
.tf-map-ph b{color:#F2E8DA}
.tf-map-btn{margin-top:4px;min-height:42px;padding:0 20px;border-radius:999px;border:0;background:#A3B98F;color:#17120E;font:700 14px 'Plus Jakarta Sans',system-ui,sans-serif;cursor:pointer}
.tf-map-btn:hover{background:#C3D4B2}
.tf-map-ph small{font-size:12px;color:#8F8173;max-width:260px}
.tf-contact{display:flex;flex-direction:column;gap:14px}
.tf-big span{font-size:17px;color:#F2E8DA}
.tf-bottom{margin-top:44px;padding-top:20px;border-top:1px solid #3A2F27;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center}
.tf-links{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:14px}
.tf-legal{margin:0;font-size:13px;color:#8F8173}
@media (max-width:1000px){
  .tf-claim{white-space:normal}
  .tf-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .tf-map{grid-column:1/-1;order:3;height:280px}
}
@media (max-width:600px){
  .tf-grid{grid-template-columns:minmax(0,1fr)}
}

/* 13.10. round 3: footer without map and directions (they moved to /rooms#find-us) */
.tf-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
@media (max-width:600px){.tf-grid{grid-template-columns:minmax(0,1fr)}}

/* 13.10. round 4: compact footer (less space above the claim, one-line contacts, links across the full width) */
.tf{padding-top:clamp(34px,4vw,52px)}
.tf-grid{margin-top:28px;align-items:center}
.tf-founded{margin-top:16px}
.tf-contact{gap:10px}
.tf-tel{display:flex;flex-wrap:wrap;align-items:center;gap:2px 12px;color:#E6DACA;text-decoration:none}
.tf-tel svg{flex:0 0 18px;width:18px;height:18px;fill:none;stroke:#A3B98F;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tf-tel span{color:#B8A999}
.tf-tel b{color:#F2E8DA;font-weight:600}
.tf-tel:hover b{color:#D9B27C}
.tf-icons{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.tf-icons a{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;border:1px solid #3A2F27;border-radius:999px;color:#E6DACA;font-size:14px;text-decoration:none;transition:border-color .2s}
.tf-icons a:hover{border-color:#D9B27C}
.tf-icons svg{width:17px;height:17px;fill:none;stroke:#A3B98F;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tf-bottom{display:block;margin-top:30px}
.tf-links{justify-content:space-between;gap:8px 22px}
.tf-legal{margin-top:14px}
@media (max-width:700px){.tf-links{justify-content:flex-start}}

/* 13.10. seven menu items (For teams): keep labels on one line, switch to burger earlier */
.g-nav a,.g-cta{white-space:nowrap}
@media (max-width:1200px){.g-nav{gap:20px}}
@media (max-width:1060px){.g-nav,.g-cta{display:none}.g-burger{display:flex}}
