@charset "utf-8";
/*--
	Color styles
--*/
.nav-holder nav li a.act-link , .nav-holder nav li a:hover , .header-search_btn i , .show-reg-form i ,  .nice-select:before ,   .main-register_title span strong , .lost_password a  , .custom-form.dark-form label span , .filter-tags input:checked:after , .custom-form  .filter-tags input:checked:after , .custom-form   .filter-tags label a , .section-subtitle  , .footer-social li a ,  .subfooter-nav li a  , #footer-twiit  .timePosted a:before ,   #subscribe-button i , .nice-select .nice-select-search-box:before , .nav-holder nav li a i   , .show-lang i    , .lang-tooltip   a:hover , .main-register-holder .tabs-menu li a i  , .header-modal_btn i , .custom-form .log-submit-btn:hover i  , .main-search-input-item label i , .header-search-input label i , .location a  , .footer-contacts li i  , #footer-twiit p.tweet:after , .subscribe-header h3 span , .footer-link i  , .footer-widget-posts   .widget-posts-date i , .clear-wishlist  , .widget-posts-descr-link a:hover , .geodir-category-location a i , .header-modal-top span strong , .cart-btn:hover i , .to-top , .map-popup-location-info i , .infowindow_wishlist-btn , .infobox-raiting_wrap span  strong , .map-popup-footer .main-link i  , .infoBox-close  , .mapnavbtn  , .mapzoom-in  , .mapzoom-out , .location-btn , .list-main-wrap-title h2 span ,.grid-opt li span.act-grid-opt , .reset-filters i , .avatar-tooltip strong , .facilities-list li i , .geodir-opt-list a:hover i , .geodir-js-favorite_btn:hover i , .geodir-category_contacts li span i , .geodir-category_contacts li a:hover , .close_gcc:hover    , .listsearch-input-wrap-header i ,.listsearch-input-item span.iconn-dec , .more-filter-option-btn i   , .clear-filter-btn i  , .back-to-filters   , .price-rage-wrap-title i  , .listsearch-input-wrap_contrl li a i  , .geodir-opt-tooltip strong    , .listing-features li i ,   .gdop-list-link:hover i  , .show-hidden-sb i , .filter-sidebar-header .tabs-menu li a i  , .datepicker--day-name ,  .scroll-nav li a.act-scrlink , .scroll-nav-wrapper-opt a.scroll-nav-wrapper-opt-btn i , .show-more-snopt:hover , .show-more-snopt-tooltip a i , .breadcrumbs a:before , .list-single-stats li span i , .list-single-main-item-title h3 i , .box-widget-item-header i , .opening-hours ul li.todaysDay span.opening-hours-day , .listing-carousel-button , .list-single-main-item-title i , .list-single-main-item-title:before , .box-widget-item-header:before ,  .list-author-widget-contacts  li span i  , .btn i , .reviews-comments-item-date i , .rate-review i , .chat-widget_input button  , .chat-widget_header  h3 a , .custom-form .review-total span input , .photoUpload span i , .bottom-bcw-box_link  a:hover  , .custom-form label i , .video-box-btn , .claim-widget-link a , .custom-form .quantity span i ,  .scroll-nav li a.act-scrlink i , .share-holder.hid-share .share-container  .share-icon , .sc-btn , .list-single-main-item-title h3 span , .ss-slider-cont , .team-social li a , .team-info h4 , .simple-title span , .back-tofilters i , .breadcrumbs.block-breadcrumbs:before , .breadcrumbs.top-breadcrumbs a:before   , .top-breadcrumbs .container:before , .header-sec-link a i  , .map-modal-container h3 a , .map-modal-close , .post-opt li i , .cat-item  li  span  , .cat-item  li  a:hover , .brd-show-share i , .author-social li a ,  .post-nav-text strong , .post-nav:before , .faq-nav li a.act-scrlink i  , .faq-nav li a.act-scrlink:before , .faq-nav li a:hover i , .log-massage a , .cart-total strong , .action-button i , .dashboard-header-stats-item span , .dashboard-header-stats-item i , .add_new-dashboard i , .tfp-btn strong  , .user-profile-menu li a i  , .logout_btn i , .dashboard-message-text p a , .dashboard-message-time i , .pass-input-wrap span  , .fuzone .fu-text i , .radio input[type="radio"]:checked + span:before , .booking-list-message-text h4  span , .dashboard-message-text h4 a:hover , .chat-contacts-item .chat-contacts-item-text span , .recomm-price i  , .time-line-icon i , .testi-link  , .testimonilas-avatar  h4  , .testimonilas-text:before, .testimonilas-text:after , .cc-btn   , .single-facts_2 .inline-facts-wrap  .inline-facts i  , .images-collage-title , .collage-image-input i  , .process-count , .listing-counter span , .main-search-input-tabs .tabs-menu li.current a , .hero-categories li a  i , .main-search-input-item span.iconn-dec , .main-search-button i , .shb , .follow-btn i , .user-profile-header_stats li span  , .follow-user-list li:hover a span , .dashboard-tabs .tabs-menu li a span , .bold-facts .inline-facts-wrap .num , .page-scroll-nav nav li a i  , .mob-nav-content-btn i , .map-close , .post-opt-title a:hover , .post-author a:hover span , .post-opt a:hover , .breadcrumbs a:hover , .reviews-comments-header h4 a:hover , .listing-item-grid_title h3 a:hover , .geodir-category-content h3 a:hover , .footer-contacts li a:hover , .footer-widget-posts .widget-posts-descr a:hover , .footer-link:hover , .geodir-category-opt h4 a:hover , .header-search-button:hover i , .list-author-widget-contacts li a:hover , .list-single-author a:hover , .close_sbfilters , .show-lang:hover i , .show-reg-form:hover , .close-reg:hover , .pac-icon:before , .pi-text h4 , .section-subtitle , .close-lpt{
	color:#a85c67;
}
.color-bg   , .nice-select .option.selected.focus , .nav-holder nav li a:before , .section-separator:before  , .footer-widget h3:before  ,   .cluster div , .pagination a.current-page, .pagination a:hover  ,  .irs-bar , .irs-slider ,  .irs-bar-edge  , .catcar-scrollbar .swiper-scrollbar-drag , .checket-cat:after , .scroll-nav li a.act-scrlink:before  , .listing-carousel_pagination .swiper-pagination-bullet.swiper-pagination-bullet-active , .box-media-zoom , .daterangepicker td.active , .list-widget-social li a , .btn.border-btn:hover  , .chat-message.chat-message_user p  , .chat-widget-button   , .tags-stylwrap a:hover , .custom-form .quantity input.qty , .listing-hero-section .list-single-header-item h1:before , .box-item a , .menu-filters a.menu-filters-active , .promo-link i , .ss-slider-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active , .accordion a.toggle span , .search-widget .search-submit:hover   , .reply-item:hover , #progressbar li.active span , #progressbar li:before , .user-profile-menu li a.user-profile-act:before , .new-dashboard-item  , .dashboard-title:before , .dhs-controls div:hover , .message-counter , .chat-contacts-item:after , .tc-pagination   .swiper-pagination-bullet.swiper-pagination-bullet-active , .tc-pagination2  .swiper-pagination-bullet.swiper-pagination-bullet-active , .down-btn i   , .listing-filters  a.gallery-filter-active , .single-facts_2 .inline-facts-wrap:before  , .single-social li  a   , .mob-nav-content-btn.slsw_vis  , .infobox-status , .header-search_container .header-search-button:hover , .pac-item:hover  , .process-item_time-line:before  , .lg-actions .lg-next:hover, .lg-actions .lg-prev:hover , .listing-item-grid_title h3:before {
	background:#a85c67;
}
.pin , .nice-select:after ,  .loader-inner  , .ed-btn     , blockquote , .main-register-holder .tabs-menu li.current , .filter-sidebar-header .tabs-menu li.current  , .header-search-input input:focus , .listsearch-input-wrap .tabs-menu li.current , .btn.border-btn {
	border-color:#a85c67;
} 
.color2-bg  , .list-widget-social li a:hover  , .accordion a.toggle.act-accordion , .banner-wdget-content a:hover , .inline-lsiw   .listsearch-input-wrap_contrl li.current a  , .cc-btn:hover     , .down-btn:hover   , .new-dashboard-item:hover  , .header-search-button:hover  , .lg-actions .lg-next, .lg-actions .lg-prev , .box-media-zoom:hover  , .main-search-button {
    background: #17191c;
}
.share-holder.hid-share .share-container  .share-icon:hover  {
	color:#17191c;
}
.green-bg , div.datedropper.primary .pick-submit , .footer-bg-pin    , .gsd_open , .verified-badge    , .toggle-filter-btn.tsb_act  , .status.st_online span  , .slide-progress  , .reply-item , #progressbar li.active:last-child  span , .user-profile-menu li a span  , .infobox-status.open , .map-popup-location-category.shop-cat  , .process-item_time-line:after     {
	background:#e3b5b9;
}
.clear-wishlist:hover , .lang-tooltip li a:before , .opening-hours ul li.todaysDay span.opening-hours-time , .pricerange , .tags-stylwrap .tags-title i  , .faq-nav li a  i  , .tfp-det p a , .tfp-btn:before  , .green-bg_color  , .testi-link:hover {
	color:#e3b5b9;
}
.orange-bg   {
	background:#8e4551;
}
.clear-singleinput   {
	color:#8e4551;
}
.blue-bg , .map-popup-location-category.gym-cat   {
	background:#e3b5b9;
}
.blue-bg_color {
	color:#e3b5b9;
}
.red-bg , .gsd_close , .map-popup-location-category.cafe-cat , .infobox-status.close  {
	background:#8e4551;
}
.red-bg_color {
	color:#8e4551;
}
.yellow-bg , .map-popup-location-category.hotels-cat {
	background:#d9a441;
}
.yellow-bg_color {
	color:#d9a441;
}
.purp-bg  , .map-popup-location-category.event-cat{
	background:#c98a92;
}
.purp-bg_color {
	color:#c98a92;
}
.dark-blue-bg {
	background: #1f2226;
}
.purp-gradient-bg {
    background: linear-gradient(to left, #DBA9CB, #b9787f);
}
.green-gradient-bg {
    background: linear-gradient(to left, #e3b5b9, #e3b5b9);
} 
.blue-gradient-bg {
    background: linear-gradient(to top, #c98a92, #c98a92);
} 
/*--
	gradient
--*/
.gradient-bg , .header-modal .tabs-menu li.current  , .scrollbar-inner2 .simplebar-scrollbar:before {
  background-color: #c98a92;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c98a92), to(#c98a92));
  background: -webkit-linear-gradient(top, #c98a92, #c98a92);
  background: -moz-linear-gradient(top, #c98a92, #c98a92);
  background: -ms-linear-gradient(top, #c98a92, #c98a92);
  background: -o-linear-gradient(top, #c98a92, #c98a92);
}
/*--
	dark gradient
--*/
.gradient-dark {
  background-color: #17191c;
  background: -webkit-gradient(linear, 20% 0%, 0% 10%, from(#2b2f34), to(#17191c));
  background: -webkit-linear-gradient(right, #2b2f34, #17191c);
  background: -moz-linear-gradient(right, #2b2f34, #17191c);
  background: -ms-linear-gradient(right, #2b2f34, #17191c);
  background: -o-linear-gradient(right, #2b2f34, #17191c);
}

/* ===============================================================
   Beauty Therapists — clinic theme
   White ground · light grey · blush accent · near-black ink
   ink #17191c | ink-soft #6b6e73 | line #e6e6e8 | grey #f4f4f5
   blush-pale #f7eded | blush-mid #e3b5b9 | blush-deep #a85c67
   =============================================================== */

/* --- white header, thin rule, dark type --- */
.main-header { background:#fff !important; border-bottom:1px solid #e6e6e8; }
/* removed: covered the header actions */
.nav-holder nav li a { color:#17191c !important; font-weight:600; }
.nav-holder nav li a:hover, .nav-holder nav li a.act-link { color:#a85c67 !important; }
.nav-holder nav ul ul { background:#fff; border:1px solid #e6e6e8; box-shadow:0 12px 30px -18px rgba(23,25,28,.28); }
.nav-holder nav ul ul li a { color:#17191c !important; }
.header-search_btn { background:#f4f4f5 !important; color:#17191c !important; }
.header-search_btn i, .header-search_btn span { color:#17191c !important; }
.show-reg-form, .show-reg-form i, .cart-btn i { color:#17191c !important; }

/* wordmark */
.bt-logo { display:flex; flex-direction:column; justify-content:center; text-decoration:none; }
.bt-logo span {
    display:block; font-family:'Raleway',sans-serif; font-weight:800;
    font-size:20px; line-height:1; letter-spacing:.005em; color:#17191c; white-space:nowrap;
}
.bt-logo em {
    display:block; font-style:normal; font-weight:700; font-size:8.5px;
    letter-spacing:.3em; text-transform:uppercase; color:#a85c67; margin-top:5px;
}
.bt-logo--footer span { color:#fff; font-size:22px; }
.bt-logo--footer em { color:#e3b5b9; }

/* --- buttons: ink primary, blush accent, square-ish and calm --- */
.color-bg, .main-search-button, .btn.color-bg { background:#17191c !important; color:#fff !important; }
.color-bg:hover, .main-search-button:hover { background:#a85c67 !important; }
.add-list { background:#a85c67 !important; color:#fff !important; font-weight:700; }
.add-list:hover { background:#17191c !important; color:#fff !important; }
.add-list span i, .add-list:hover span i { color:#fff !important; }

/* verified mark = blush, dark type */
.verified-badge { background:#e3b5b9 !important; }
.verified-badge:before { color:#17191c !important; }

/* --- grounds --- */
body, .content { background:#fff; }
.gray-bg, .section-bg { background:#f4f4f5 !important; }
.listing-item-container, .geodir-category-listing { background:#fff; }

/* soften the template's heavy card shadows for a clinic feel */
.geodir-category-listing, .listing-item .geodir-category-listing,
.box-widget, .list-single-main-item, .dashboard-list-box {
    box-shadow:0 1px 2px rgba(23,25,28,.04) !important;
    border:1px solid #e6e6e8;
}

/* hero */
.hero-section .bg-parallax-wrap .bg, .hero-section .bg.mob_bg {
    display:block !important; top:0 !important; left:0 !important; right:0 !important;
    height:110% !important; background-size:cover !important; background-position:62% 38% !important;
}
.hero-section .overlay.op7 { opacity:.34 !important; background:#17191c; }
.hero-section h1 { letter-spacing:-0.02em; }

/* Hero stacking: the still fallback must sit UNDER the video, not over it */
.hero-section .bg.mob_bg      { z-index:1; }
.hero-section .video-container{ z-index:2; }
.hero-section .overlay.op7    { z-index:3; }
.hero-section .container      { z-index:4; }

/* Hero video — template centres .video-container with a translate(-50%,-50%);
   we fill the hero instead, so that transform must be cancelled, not just offset. */
.hero-section .video-container{
    position:absolute;
    top:0; left:0; right:0; bottom:0;
    width:100%; height:100%;
    transform:none;
    line-height:0;
    overflow:hidden;
    z-index:2;
}
.hero-section .video-container video.bgvid{
    position:absolute;
    top:50%; left:50%;
    transform:translate(-50%,-50%);
    width:auto; height:auto;
    min-width:100%; min-height:100%;
    object-fit:cover;
}

/* ===============================================================
   Top bar — full width on load, floating pill on scroll.
   Same three-column setup in both states: nav left, wordmark
   centre, actions right.
   =============================================================== */
.bt-header{
    position:fixed; top:0; left:0; right:0; z-index:200;
    background:transparent; border:0; box-shadow:none;
    padding:0; height:auto;
    transition:padding .45s cubic-bezier(.22,1,.36,1);
}
.bt-bar{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:24px;
    padding:0 34px;
    min-height:78px;
    background:#fff;
    border-bottom:1px solid #e6e6e8;
    border-radius:0;
    transition:max-width .45s cubic-bezier(.22,1,.36,1),
               border-radius .45s cubic-bezier(.22,1,.36,1),
               box-shadow .45s cubic-bezier(.22,1,.36,1),
               min-height .45s cubic-bezier(.22,1,.36,1),
               padding .45s cubic-bezier(.22,1,.36,1);
    max-width:none; margin:0 auto;
}
/* scrolled: contract into the pill */
.bt-header.is-stuck{ padding:14px 22px; }
.bt-header.is-stuck .bt-bar{
    max-width:1240px;
    min-height:66px;
    padding:0 14px 0 26px;
    border:1px solid #e6e6e8;
    border-radius:100px;
    box-shadow:0 18px 44px -26px rgba(23,25,28,.42);
}

.bt-bar__left{ display:flex; align-items:center; gap:14px; min-width:0; }
.bt-bar__right{ display:flex; align-items:center; justify-content:flex-end; gap:20px; min-width:0; }

/* centred wordmark */
.bt-bar__centre{ justify-self:center; text-align:center; }
.bt-bar__centre span{ font-size:19px; letter-spacing:.01em; }
.bt-bar__centre em{ text-align:center; }

/* nav */
.bt-header .nav-holder{ float:none; margin:0; }
.bt-header .nav-holder nav > ul{ display:flex; align-items:center; gap:26px; margin:0; }
.bt-header .nav-holder nav > ul > li{ float:none; margin:0; }
.bt-header .nav-holder nav > ul > li > a{
    padding:0; font-size:13.5px; font-weight:600; color:#17191c; line-height:78px;
    transition:color .3s, line-height .45s cubic-bezier(.22,1,.36,1);
}
.bt-header.is-stuck .nav-holder nav > ul > li > a{ line-height:66px; }
.bt-header .nav-holder nav > ul > li > a:hover{ color:#a85c67; }
.bt-header .nav-holder nav ul ul{ top:100%; border-radius:10px; }

/* right-hand actions */
.bt-header .header-search_btn{
    width:auto; background:none; padding:0; margin:0; cursor:pointer;
}
.bt-header .header-search_btn i{ font-size:15px; color:#17191c; }
.bt-header .show-reg-form{
    position:static; display:flex; align-items:center; gap:7px;
    background:none; padding:0; margin:0; width:auto; height:auto;
    font-size:13.5px; font-weight:600; color:#17191c; cursor:pointer;
}
.bt-header .show-reg-form i{ font-size:14px; }
.bt-header .add-list{
    position:static; display:inline-flex; align-items:center; gap:9px;
    margin:0; padding:12px 20px; height:auto; float:none;
    background:#a85c67 !important; color:#fff !important;
    border-radius:100px; font-size:13px; font-weight:600; letter-spacing:0;
}
.bt-header .add-list:hover{ background:#17191c !important; }
.bt-header .add-list i{ font-size:12px; color:#fff !important; }

/* mobile burger hidden on desktop */
.bt-header .nav-button-wrap{ display:none; background:none; }

@media (max-width:1150px){
    .bt-bar{ grid-template-columns:auto 1fr auto; padding:0 18px; }
    .bt-header .nav-holder{ display:none; }
    .bt-header .nav-button-wrap{ display:block; }
    .bt-header .show-reg-form span,
    .bt-header .add-list{ display:none; }
    .bt-header.is-stuck{ padding:10px 12px; }
}

/* ===============================================================
   Hero — full-bleed, video fills it, search sits low like the mockup
   =============================================================== */
.hero-section{
    height:auto;
    min-height:100svh;
    padding:0;
    display:flex; flex-direction:column; justify-content:flex-end;
}
.hero-section .bg-tabs-wrap,
.hero-section .bg-parallax-wrap{ position:absolute; inset:0; height:100%; }
.hero-section .container.small-container{
    position:relative; z-index:4;
    width:100%; max-width:1160px;
    padding-bottom:clamp(90px,12vh,150px);
    padding-top:150px;
}
.hero-section .intro-item{ margin-bottom:38px; }
.hero-section .intro-item h1{
    font-size:clamp(2.6rem,5vw,4.1rem);
    line-height:1.06;
    letter-spacing:-.025em;
    max-width:19ch; margin:0 auto;
}
.hero-section .intro-item h3{
    font-size:15px; font-weight:500; line-height:1.6;
    max-width:60ch; margin:18px auto 0; opacity:.9;
}
/* scroll cue sits at the very bottom */
.hero-section .header-sec-link{ position:absolute; bottom:26px; left:0; right:0; z-index:5; }

@media (max-width:720px){
    .hero-section{ min-height:88svh; }
    .hero-section .container.small-container{ padding-top:120px; padding-bottom:60px; }
}

/* --- kill the template's decorative header blocks (they covered the actions) --- */
.bt-header:before, .bt-header:after{ display:none !important; content:none !important; }
.bt-header .bt-bar{ position:relative; z-index:2; }

/* search overlay: float it under the bar instead of sitting in flow */
.bt-header .header-search-input{
    position:absolute; top:100%; left:0; right:0; z-index:1;
    background:#fff; border-bottom:1px solid #e6e6e8;
    padding:16px 34px; display:none;
}
.bt-header .header-search-input.vis-search{ display:block; }
.bt-header.is-stuck .header-search-input{
    max-width:1240px; margin:8px auto 0; border:1px solid #e6e6e8; border-radius:16px;
}

/* nav + wordmark share the bar's vertical centre */
.bt-bar__left, .bt-bar__centre, .bt-bar__right{ align-self:center; }
.bt-header .nav-holder nav > ul > li > a{ line-height:1.2; display:block; padding:6px 0; }
.bt-header.is-stuck .nav-holder nav > ul > li > a{ line-height:1.2; }
.bt-bar__centre{ display:flex; flex-direction:column; justify-content:center; }

/* locality relabel */
.bt-locality__change{
    border:0; background:none; cursor:pointer; padding:0 0 0 10px;
    font-size:.5em; font-weight:500; color:#a85c67; text-decoration:underline;
    text-underline-offset:3px; vertical-align:middle;
}
.bt-locality__change:hover{ color:#17191c; }

/* ===============================================================
   Verification section
   =============================================================== */
.bt-verify{
    background:linear-gradient(180deg,#f6f2ef 0%,#efe9e6 100%);
    padding:clamp(70px,9vw,120px) 0;
}
.bt-verify__inner{
    max-width:1240px; margin:0 auto; padding:0 34px;
    display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
    gap:clamp(40px,6vw,90px); align-items:start;
}
.bt-verify__eyebrow{
    display:flex; align-items:center; gap:9px;
    font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
    color:#a85c67; margin:0 0 22px;
}
.bt-verify__eyebrow span{ width:6px; height:6px; border-radius:50%; background:#a85c67; }
.bt-verify h2{
    font-size:clamp(2rem,3.4vw,2.9rem); line-height:1.1; letter-spacing:-.025em;
    color:#17191c; margin:0 0 22px;
}
.bt-verify__lede{ font-size:15.5px; line-height:1.7; color:#4a4a4d; max-width:46ch; margin:0 0 34px; }
.bt-verify__lede strong{ color:#17191c; font-weight:600; }

.bt-verify__stats{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:26px; }
.bt-verify__stat{
    background:#fff; border:1px solid #e6e0dc; border-radius:14px; padding:22px 20px;
}
.bt-verify__stat p{ font-size:13px; line-height:1.55; color:#65625f; margin:0; }
.bt-verify__num{
    font-size:26px !important; font-weight:600; color:#17191c;
    letter-spacing:-.02em; margin:0 0 8px !important;
}
.bt-verify__caveat{
    display:flex; gap:12px; align-items:flex-start;
    border:1px solid #e6e0dc; border-radius:14px; padding:16px 18px; margin-bottom:30px;
}
.bt-verify__caveat i{ color:#a85c67; font-size:14px; margin-top:3px; }
.bt-verify__caveat p{ font-size:12.5px; line-height:1.6; color:#65625f; margin:0; }
.bt-verify__caveat strong{ color:#17191c; }
.bt-verify__btn{
    display:inline-flex; align-items:center; gap:10px;
    background:#17191c; color:#fff; border-radius:100px;
    padding:14px 26px; font-size:13.5px; font-weight:600;
    transition:background .3s;
}
.bt-verify__btn:hover{ background:#a85c67; color:#fff; }

/* the record card */
.bt-record{
    background:#fff; border:1px solid #e6e0dc; border-radius:18px;
    box-shadow:0 30px 70px -46px rgba(23,25,28,.5); overflow:hidden;
}
.bt-record__head{
    display:flex; justify-content:space-between; align-items:center;
    padding:15px 22px; border-bottom:1px solid #efeae7;
    font-size:10.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:#8b8681;
}
.bt-record__ref{ color:#b8b2ad; letter-spacing:.1em; }
.bt-record__who{ display:flex; align-items:center; gap:14px; padding:20px 22px; }
.bt-record__avatar{
    width:38px; height:38px; border-radius:50%; flex-shrink:0;
    display:grid; place-items:center; background:#f1eae6;
    font-size:12px; font-weight:600; color:#8a6a70;
}
.bt-record__name{ font-size:15.5px; font-weight:600; color:#17191c; margin:0; }
.bt-record__spec{ font-size:12.5px; color:#7d7975; margin:2px 0 0; }
.bt-record__badge{
    margin-left:auto; display:inline-flex; align-items:center; gap:6px;
    background:#f2e7e8; color:#8e4551; border-radius:100px;
    padding:6px 12px; font-size:11px; font-weight:600;
}
.bt-record__list{ list-style:none; margin:0; padding:0 22px 6px; }
.bt-record__list li{
    display:grid; grid-template-columns:auto 1fr auto; gap:13px;
    padding:15px 0; border-top:1px solid #f2eeec; align-items:start;
}
.bt-record__list i{ color:#7fa07f; font-size:15px; margin-top:2px; }
.bt-record__label{ font-size:13.5px; font-weight:600; color:#17191c; margin:0 0 3px; }
.bt-record__list p:not(.bt-record__label){ font-size:12.5px; line-height:1.55; color:#75716d; margin:0; }
.bt-record__date{ font-size:11.5px; color:#a5a09b; white-space:nowrap; }
.bt-record__foot{
    display:flex; justify-content:space-between; align-items:center;
    padding:15px 22px; border-top:1px solid #efeae7; background:#fbf9f8;
    font-size:12.5px; color:#7d7975;
}
.bt-record__foot a{ color:#a85c67; font-weight:600; }

@media (max-width:980px){
    .bt-verify__inner{ grid-template-columns:1fr; }
    .bt-verify__stats{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
    .bt-verify__stats{ grid-template-columns:1fr; }
    .bt-record__list li{ grid-template-columns:auto 1fr; }
    .bt-record__date{ grid-column:2; }
}

/* verification block is left-aligned; template centres section content by default */
.bt-verify, .bt-verify *{ text-align:left; }
.bt-verify__num{ text-align:left; }
.bt-record__list li p{ text-align:left; }
.bt-verify__stats--single{ grid-template-columns:1fr; max-width:420px; }

/* ===============================================================
   Awarding bodies band
   =============================================================== */
.bt-bodies{ background:#fff; border-top:1px solid #e6e6e8; border-bottom:1px solid #e6e6e8; padding:40px 0; }
.bt-bodies__inner{ max-width:1240px; margin:0 auto; padding:0 34px; text-align:center; }
.bt-bodies__label{
    font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
    color:#8b8681; margin:0 0 18px;
}
.bt-bodies__list{
    list-style:none; margin:0 0 16px; padding:0;
    display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:14px 34px;
}
.bt-bodies__list li{
    font-family:var(--font-title); font-size:17px; font-weight:600;
    letter-spacing:.02em; color:#17191c; opacity:.62;
}
.bt-bodies__note{ font-size:13px; color:#8b8681; margin:0; }

/* ===============================================================
   For clinics
   =============================================================== */
.bt-clinics{ background:#17191c; color:#fff; }
.bt-clinics__inner{
    max-width:1240px; margin:0 auto;
    display:grid; grid-template-columns:minmax(0,1fr) minmax(0,44%); align-items:stretch;
}
.bt-clinics__copy{ padding:clamp(56px,7vw,92px) clamp(28px,4vw,60px); }
.bt-clinics__eyebrow{
    font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
    color:#d79aa3; margin:0 0 20px;
}
.bt-clinics h2{
    font-size:clamp(1.9rem,3.2vw,2.7rem); line-height:1.1; letter-spacing:-.025em;
    color:#fff; margin:0 0 20px;
}
.bt-clinics__copy > p{ font-size:15.5px; line-height:1.7; color:rgba(255,255,255,.72); max-width:48ch; margin:0 0 26px; }
.bt-clinics__list{ list-style:none; margin:0 0 32px; padding:0; display:grid; gap:11px; max-width:48ch; }
.bt-clinics__list li{ position:relative; padding-left:26px; font-size:14.5px; color:rgba(255,255,255,.86); }
.bt-clinics__list li:before{
    content:""; position:absolute; left:0; top:.55em;
    width:7px; height:7px; border-radius:50%; background:#d79aa3;
}
.bt-clinics__cta{ display:flex; flex-wrap:wrap; align-items:center; gap:18px; }
.bt-clinics__btn{
    display:inline-flex; align-items:center; gap:10px;
    background:#fff; color:#17191c; border-radius:100px;
    padding:14px 26px; font-size:13.5px; font-weight:600;
    font-family:var(--font-title); transition:background .3s,color .3s;
}
.bt-clinics__btn:hover{ background:#d79aa3; color:#17191c; }
.bt-clinics__price{ font-size:13px; color:rgba(255,255,255,.55); }
.bt-clinics__media{ position:relative; overflow:hidden; min-height:340px; }
.bt-clinics__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

@media (max-width:900px){
    .bt-clinics__inner{ grid-template-columns:1fr; }
    .bt-clinics__media{ min-height:260px; order:-1; }
}

/* clinic band: left-aligned, media bleeds to the right edge */
.bt-clinics, .bt-clinics *{ text-align:left; }
.bt-clinics__inner{
    max-width:none; width:100%;
    grid-template-columns:minmax(0,1fr) minmax(0,46%);
}
.bt-clinics__copy{
    max-width:760px; margin-left:auto; width:100%;
    padding-right:clamp(28px,4vw,70px);
}
.bt-clinics__media{ min-height:100%; }

/* awarding bodies stays centred — it's a band, not a column */
.bt-bodies, .bt-bodies *{ text-align:center; }

/* ===============================================================
   Top bar — alignment fixes.
   Template rules give the logo/search their own padding, floats and
   line-heights, which pushed them below the bar's optical centre.
   =============================================================== */
.bt-header{ background:transparent !important; box-shadow:none !important; }
.bt-header:not(.is-stuck) .bt-bar{ border-radius:0; }

/* every bar child measures from the same centre line */
.bt-bar{ align-items:center; }
.bt-bar__left, .bt-bar__centre, .bt-bar__right{
    align-self:center; height:auto; margin:0; padding:0; float:none;
}

/* wordmark */
.bt-bar__centre.logo-holder{
    display:flex; flex-direction:column; justify-content:center;
    height:auto !important; padding:0 !important; margin:0 !important;
    float:none !important; position:static !important; line-height:1;
}
.bt-bar__centre span{ line-height:1; margin:0; }
.bt-bar__centre em{ line-height:1; margin-top:5px; }

/* nav links: kill template line-height so they centre with everything else */
.bt-header .nav-holder{ float:none; margin:0; padding:0; height:auto; }
.bt-header .nav-holder nav{ float:none; }
.bt-header .nav-holder nav > ul{
    display:flex; align-items:center; gap:26px; margin:0; padding:0; height:auto;
}
.bt-header .nav-holder nav > ul > li{ float:none; margin:0; padding:0; line-height:1; }
.bt-header .nav-holder nav > ul > li > a{
    display:inline-flex; align-items:center; gap:6px;
    line-height:1 !important; padding:0 !important; margin:0 !important; height:auto !important;
}

/* right cluster */
.bt-bar__right{ display:flex; align-items:center; gap:20px; }
.bt-header .header-search_btn{
    display:inline-flex; align-items:center; justify-content:center;
    height:auto !important; width:auto !important;
    padding:0 !important; margin:0 !important; float:none !important;
    background:none !important; line-height:1;
}
.bt-header .header-search_btn i{ line-height:1; }
.bt-header .show-reg-form{
    display:inline-flex; align-items:center; gap:7px;
    height:auto !important; padding:0 !important; margin:0 !important;
    float:none !important; position:static !important; line-height:1;
}
.bt-header .add-list{
    display:inline-flex; align-items:center; gap:9px;
    height:auto !important; padding:12px 20px !important; margin:0 !important;
    float:none !important; position:static !important; line-height:1;
}

/* template offsets the search button with position:relative; top:18px */
.bt-header .header-search_btn{ position:static !important; top:auto !important; }

/* ===============================================================
   Search dropdown stacking.
   .hero-section .container creates a stacking context at z-index 4,
   so the panel's own z-index cannot beat the scroll cue (5), which
   is its sibling. Lift the container, drop the cue.
   =============================================================== */
.hero-section .container.small-container{ z-index:20; }
.hero-section .header-sec-link{ z-index:2; }
.rs{ position:relative; z-index:30; }
.rs__panel{ z-index:40; }

/* the glass needs more body over moving video than over a still */
.rs{
    --rs-panel:rgba(18,16,15,.93);
    --rs-tint:rgba(255,255,255,.13);
    --rs-tint-focus:rgba(255,255,255,.17);
}
.rs__panel{ box-shadow:0 30px 70px -20px rgba(0,0,0,.7); }

/* ===============================================================
   Hero spacing — the search must sit high enough that its dropdown
   has room on a laptop viewport, not open below the fold.
   =============================================================== */
.hero-section{ justify-content:center; }
.hero-section .container.small-container{
    padding-top:clamp(96px,12vh,150px);
    padding-bottom:clamp(230px,38vh,420px);
}
.hero-section .intro-item{ margin-bottom:30px; }
.hero-section .intro-item h1{ font-size:clamp(2.3rem,4.4vw,3.5rem); }
.hero-section .intro-item h3{ margin-top:14px; }

/* keep the panel inside the viewport whatever the hero height */
.rs__scroll{ max-height:min(342px,42vh); }

/* ===============================================================
   Cards — beige wash instead of the navy gradient, so card text
   must flip from white to ink. Icons aligned on one baseline.
   =============================================================== */
.geodir-category-content h3,
.geodir-category-content h3 a,
.geodir-category-location a,
.geodir-category-content .geodir-category-location a{
    color:#17191c !important;
}
.geodir-category-location a i,
.geodir-category-content h3 a:hover{ color:#a85c67 !important; }

/* rating chip stays dark for contrast against the beige */
.geodir-category-content .listing-rating-count-wrap .rate-class-name,
.rate-class-name{ background:#17191c !important; color:#fff !important; }
.rate-class-name .rate-class-name_txt,
.rate-class-name span{ color:#fff !important; }
.listing-rating-count-wrap .reviews-count{ color:#6b6e73 !important; }

/* footer row of each card: one baseline, even spacing */
.geodir-category-footer{
    display:flex; align-items:center; gap:14px;
    padding:14px 20px !important; border-top:1px solid #ecebe9;
}
.geodir-category-footer > div,
.geodir-category-footer > a{ margin:0 !important; float:none !important; }
.geodir-category-footer .geodir-opt-list{ margin-left:auto !important; display:flex; gap:12px; align-items:center; }
.geodir-opt-list a{ display:inline-flex; align-items:center; justify-content:center; }

/* avatar bubble that had no image */
.geodir-category-footer .geodir-category-opt-avatar,
.geodir-category-footer img[src*="Your image"]{ display:none !important; }

/* ===============================================================
   Hero sizing — final. Content is centred inside exactly one
   viewport; oversized padding was making the section grow past
   100svh and pushing the search bar (and its dropdown) off-screen.
   =============================================================== */
.hero-section{
    min-height:100svh; height:100svh;
    display:flex; align-items:center; justify-content:center;
    overflow:visible;
}
.hero-section .container.small-container{
    padding-top:96px;
    padding-bottom:0;
    display:flex; flex-direction:column; justify-content:center;
}
.hero-section .intro-item{ margin-bottom:26px; }
.hero-section .intro-item h1{
    font-size:clamp(2.1rem,3.9vw,3.1rem);
    line-height:1.08;
    max-width:20ch;
}
.hero-section .intro-item h3{ font-size:14.5px; margin-top:12px; }
.rs__popular{ margin-top:14px; }

@media (max-height:760px){
    .hero-section .intro-item h1{ font-size:clamp(1.9rem,3.2vw,2.5rem); }
    .hero-section .intro-item h3{ display:none; }
}

/* Card overlay is now a light wash, so its type must be ink not white */
.listing_carditem .geodir-category-opt_title h4 a,
.listing_carditem .geodir-category-location a,
.geodir-category-opt_title h4 a,
.geodir-category-location a{ color:#17191c !important; }
.geodir-category-location a i{ color:#a85c67 !important; }
.listing_carditem_footer{ border-top:1px solid rgba(23,25,28,.12) !important; }
.listing_carditem_footer span,
.listing-item-category-wrap span{ color:#17191c !important; font-weight:500; }
.listing_carditem .reviews-count{ color:#6b6e73 !important; }
.listing_carditem .review-score{ background:#17191c !important; color:#fff !important; }

/* footer row: one baseline */
.listing_carditem_footer{ display:flex; align-items:center; gap:12px; }
.listing_carditem_footer > *{ margin:0 !important; }
.listing-item-category-wrap{ display:inline-flex; align-items:center; gap:9px; }
.listing-item-category{ display:inline-flex; align-items:center; justify-content:center; }

/* ===============================================================
   Carousel cards — content out of the photo, into a clean block
   underneath. Text over a light image never read properly.
   =============================================================== */
.listing_carditem .geodir-category-listing{
    background:#fff; border:1px solid #e8e6e3; border-radius:14px;
    overflow:hidden; display:flex; flex-direction:column;
    box-shadow:0 1px 2px rgba(23,25,28,.04);
}
.listing_carditem .geodir-category-img{ position:relative; margin:0; }
.listing_carditem .geodir-category-img-wrap{
    display:block; border-radius:0; aspect-ratio:16/11; overflow:hidden;
}
.listing_carditem .geodir-category-img-wrap img{
    width:100%; height:100%; object-fit:cover; display:block;
}
/* kill the wash — no text sits on the photo now */
.listing_carditem .geodir-category-img-wrap:before{ display:none !important; }

/* content block */


.listing_carditem .geodir-category-opt_title h4{ margin:0 0 5px; }
.listing_carditem .geodir-category-opt_title h4 a{
    font-family:var(--font-title); font-size:17.5px; font-weight:600;
    letter-spacing:-.01em; color:#17191c !important;
}
.listing_carditem .geodir-category-location a{
    font-size:13px; color:#6b6e73 !important; display:inline-flex; align-items:center; gap:6px;
}

/* rating: inline under the name, not floating */
.listing_carditem .listing-rating-count-wrap{
    position:static !important; display:flex; align-items:center; gap:9px;
    margin-top:10px; float:none !important;
}
.listing_carditem .review-score{
    background:#17191c !important; color:#fff !important;
    border-radius:6px; padding:3px 8px; font-size:12.5px; font-weight:600;
    line-height:1.2; min-width:auto;
}
.listing_carditem .listing-rating{ margin:0 !important; }
.listing_carditem .reviews-count{
    color:#8b8681 !important; font-size:12px; margin:0 !important; display:inline;
}
.listing_carditem .listing-rating-count-wrap br{ display:none; }

/* footer row */
.listing_carditem .listing_carditem_footer{
    margin:14px 0 0 !important; padding:12px 18px 14px !important;
    border-top:1px solid #efedea !important;
    display:flex; align-items:center; gap:10px;
}
.listing_carditem .listing-item-category{
    width:30px; height:30px; border-radius:50%;
    background:#f4ecec !important; color:#a85c67 !important;
    display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
}
.listing_carditem .listing-item-category i{ color:#a85c67 !important; font-size:13px; }
.listing_carditem .listing-item-category-wrap span{
    font-size:13.5px; font-weight:500; color:#17191c !important;
}

/* rating sits on one line under the name, not a 132px stack */
.listing_carditem .listing-rating-count-wrap{
    display:flex !important; align-items:center; gap:8px;
    height:auto !important; margin:9px 0 0 !important; padding:0 !important;
}
.listing_carditem .listing-rating-count-wrap > *{ margin:0 !important; float:none !important; }
.listing_carditem .listing-rating{
    display:inline-flex !important; align-items:center; height:auto !important;
}
.listing_carditem .review-score{ line-height:1.25; }

/* "we're not in your town yet" notice */
.bt-notice{
    background:#faf7f5; border:1px solid #e8e0dc; border-radius:14px;
    padding:22px 24px; margin:0 0 26px;
}
.bt-notice h4{
    font-family:var(--font-title); font-size:18px; font-weight:600;
    color:#17191c; margin:0 0 8px; letter-spacing:-.01em;
}
.bt-notice p{ font-size:14.5px; color:#6b6e73; margin:0 0 16px; max-width:62ch; }
.bt-notice__towns{ display:flex; flex-wrap:wrap; gap:9px; }
.bt-notice__towns a{
    display:inline-flex; align-items:center; gap:8px;
    background:#fff; border:1px solid #e5e2e0; border-radius:100px;
    padding:8px 15px; font-size:13.5px; font-weight:500; color:#17191c;
    transition:border-color .25s, color .25s;
}
.bt-notice__towns a:hover{ border-color:#a85c67; color:#a85c67; }
.bt-notice__towns a span{ color:#8b8681; font-size:12.5px; }

/* notice sits left-aligned like the rest of the results column */
.bt-notice, .bt-notice *{ text-align:left; }
.bt-notice{ max-width:none; }

/* ===============================================================
   Carousel card — the template builds this with floats, so the
   content block escaped flow and overlapped the photo. Clear every
   float and lay the card out as a simple column.
   =============================================================== */
.listing_carditem .geodir-category-listing{
    display:flex; flex-direction:column; float:none; overflow:hidden;
}
.listing_carditem .geodir-category-img{
    float:none !important; display:block; width:100%; position:relative;
    margin:0 !important; overflow:hidden;
}
.listing_carditem .geodir-category-img-wrap{
    float:none !important; display:block; width:100%;
    aspect-ratio:4/3; max-height:250px; overflow:hidden; border-radius:0;
}
.listing_carditem .geodir-category-img-wrap img{
    width:100%; height:100%; object-fit:cover; display:block;
}


.listing_carditem .geodir-category-opt_title h4{
    margin:0 0 6px !important; line-height:1.25;
}
.listing_carditem .listing_carditem_footer{ float:none !important; width:100%; }
/* belt and braces for the float-based template */
.listing_carditem .geodir-category-img:after,
.listing_carditem .geodir-category-opt:after{ content:""; display:table; clear:both; }

/* rating belongs on its own line, not on top of the address */

.listing_carditem .geodir-category-location{ display:block; width:100%; }
.listing_carditem .geodir-category-location a{ white-space:normal; }
.listing_carditem .listing-rating-count-wrap{
    clear:both; float:none !important;
    margin:10px 0 0 !important; width:100%;
}

/* ===============================================================
   Card alignment — one left edge for every row.
   The footer carried its own 18px padding on top of the content
   block's, so the treatment row sat 18px right of everything else.
   =============================================================== */

.listing_carditem .listing_carditem_footer{
    padding:13px 0 15px !important;
    margin:14px 0 0 !important;
}
.listing_carditem .listing-item-category-wrap{
    display:inline-flex; align-items:center; gap:12px; margin:0 !important;
}

/* rating row: chip, stars and count share one centre line */
.listing_carditem .listing-rating-count-wrap{
    display:flex !important; align-items:center; gap:10px;
    margin:9px 0 0 !important;
}
.listing_carditem .review-score{
    display:inline-flex; align-items:center; justify-content:center;
    height:22px; padding:0 8px; border-radius:6px; font-size:12.5px;
}
.listing_carditem .listing-rating{ display:inline-flex !important; align-items:center; height:22px; }
.listing_carditem .reviews-count{ display:inline-flex; align-items:center; height:22px; line-height:1; }

/* even vertical rhythm */
.listing_carditem .geodir-category-opt_title h4{ margin:0 0 7px !important; }
.listing_carditem .geodir-category-location{ margin:0 !important; }
.listing_carditem .geodir-category-location a{ display:inline-flex; align-items:center; gap:7px; line-height:1.3; }

/* grab cursor so the carousel reads as draggable */
.listing-carousel .swiper-container{ cursor:grab; }
.listing-carousel .swiper-container:active{ cursor:grabbing; }

/* ===============================================================
   Member card — two rows: name / location, then treatments / CTA
   =============================================================== */
.listing_carditem .geodir-category-listing{
    background:#fff; border:1px solid #e8e6e3; border-radius:16px;
    overflow:hidden; display:flex; flex-direction:column;
    box-shadow:0 1px 3px rgba(23,25,28,.05);
}
.listing_carditem .geodir-category-img{ float:none !important; margin:0 !important; }
.listing_carditem .geodir-category-img-wrap{
    float:none !important; display:block; width:100%;
    aspect-ratio:16/10; max-height:none; border-radius:0; overflow:hidden;
}
.listing_carditem .geodir-category-img-wrap img{ width:100%; height:100%; object-fit:cover; }

.bt-card__row{ display:flex; align-items:center; justify-content:space-between; gap:18px; }
/* name and place share one line; the narrow grid cards leave only ~293px for
   both, so keep the gap tight and let the name truncate rather than wrap —
   a wrapped name adds a line and breaks the masonry into ragged rows */
.bt-card__row--head{ align-items:baseline; gap:12px; }

/* the name is the identity — it never shrinks and never wraps. If the pair
   won't fit, the place gives way (it's already implied by the page context). */
.bt-card__name{ margin:0 !important; flex:0 0 auto; min-width:0; }
.bt-card__name a{
    font-family:var(--font-title); font-size:21px; font-weight:600;
    letter-spacing:-.02em; color:#17191c !important; line-height:1.15;
    display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.bt-card__name a:hover{ color:#a85c67 !important; }

/* block rather than inline-flex so text-overflow can act on the text node —
   the pin is floated into the line instead of being a flex sibling */
.bt-card__loc{
    display:block; flex:0 1 auto; min-width:0;
    font-size:13px; color:#6b6e73;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.bt-card__pin{
    width:15px; height:15px; flex-shrink:0;
    display:inline-block; vertical-align:-2.5px; margin-right:7px;
    fill:none; stroke:#a85c67; stroke-width:1.8;
    stroke-linecap:round; stroke-linejoin:round;
}

/* treatment chips */
.bt-card__tx{ display:flex; align-items:center; column-gap:15px; row-gap:10px; flex-wrap:wrap; min-width:0; }
/* fixed line-height keeps the chip box a whole number of pixels — inherited 26.4px
   left the wrapped row at 60.55px and pushed the card 2px out of true. */
.bt-tx{ display:inline-flex; align-items:center; gap:7px; line-height:20px; }
.bt-tx__i{
    width:17px; height:17px; flex-shrink:0;
    fill:none; stroke:#a85c67; stroke-width:1.7;
    stroke-linecap:round; stroke-linejoin:round;
}
.bt-tx__l{ font-size:13.5px; color:#4a4a4d; white-space:nowrap; }

/* CTA — quiet, sized to sit level with the treatment row */
.bt-card__cta{
    flex-shrink:0; display:inline-flex; align-items:center; justify-content:center;
    height:38px; padding:0 20px; border-radius:8px;
    background:transparent; color:#17191c !important;
    border:1px solid #d8d4d0;
    font-family:var(--font-title); font-size:13px; font-weight:600; letter-spacing:.005em;
    white-space:nowrap;
    transition:border-color .25s var(--ease-lux), background .25s var(--ease-lux), color .25s var(--ease-lux);
}
.bt-card__cta:hover{
    background:#17191c; border-color:#17191c; color:#fff !important;
}

/* things the wireframe drops */
.listing_carditem .listing-rating-count-wrap,
.listing_carditem .listing_carditem_footer,
.listing_carditem .geodir_status_date{ display:none !important; }

@media (max-width:520px){
    .bt-card__row{ flex-direction:column; align-items:flex-start; gap:12px; }
    .bt-card__cta{ width:100%; }
}

/* the rebuilt card in grid/list contexts (not just the carousel) */
.bt-member{
    background:#fff; border:1px solid #e8e6e3; border-radius:16px;
    overflow:hidden; display:flex; flex-direction:column;
    box-shadow:0 1px 3px rgba(23,25,28,.05); margin-bottom:26px;
}
.bt-member .geodir-category-img{
    float:none !important; margin:0 !important; position:relative; overflow:hidden;
}
.bt-member .geodir-category-img-wrap{
    float:none !important; display:block; width:100%;
    aspect-ratio:16/10; border-radius:0; overflow:hidden;
}
.bt-member .geodir-category-img-wrap:before{ display:none !important; }
.bt-member .geodir-category-img-wrap img{ width:100%; height:100%; object-fit:cover; display:block; }

/* list view: image beside the content */
.list-layout .bt-member{ flex-direction:row; }
.list-layout .bt-member .geodir-category-img{ width:38%; flex-shrink:0; }
.list-layout .bt-member .geodir-category-img-wrap{ height:100%; aspect-ratio:auto; }
.list-layout .bt-member .bt-card{ flex:1; justify-content:center; }

@media (max-width:760px){
    .list-layout .bt-member{ flex-direction:column; }
    .list-layout .bt-member .geodir-category-img{ width:100%; }
    .list-layout .bt-member .geodir-category-img-wrap{ aspect-ratio:16/10; }
}

/* card body — single source of truth.
   Block layout with explicit margins rather than flex+gap: as a flex column the
   box measured 16px taller than the sum of its children and margin-top:auto
   never resolved, because the parent (.geodir-category-img) is not a flex box. */
.geodir-category-opt.bt-card{
    padding:20px 22px 22px !important;
    display:block;
    background:#fff;
    position:static !important; float:none !important;
}
.bt-card__row--head{ margin:0 0 16px !important; }
.bt-card__row--foot{ margin:0 !important; }
/* the chip list wraps to two lines on the narrow grid cards, so bottom-align it
   against the CTA — keeps the gap under the button at 22px, level with the sides.
   Only while the row is a row: under 520px it stacks, and flex-end would push the
   chips to the right-hand edge. */
@media (min-width:521px){
    .bt-card__row--foot{ align-items:flex-end; }
}

/* ===============================================================
   Mobile. Verified at 375x812 — every rule here fixes something
   that was visible in a screenshot, not something that "should" work.
   =============================================================== */
@media (max-width:1150px){
    /* The @media at the top of this file already hides these below 1150px,
       but the "right cluster" rules further down re-enabled them on source
       order — which is why the logo, Sign in and the CTA pill were sitting
       on top of each other at 375px. */
    .bt-header .add-list{ display:none !important; }

    /* "Sign in" is a bare text node next to the icon, not a <span> — zero the
       font size on the link and restore it on the icon */
    .bt-header .show-reg-form{ font-size:0 !important; gap:0 !important; }
    .bt-header .show-reg-form i{ font-size:17px !important; }

    /* hamburger bars were white on a white bar, i.e. invisible */
    .bt-header .nav-button span{ background:#17191c !important; }
    /* the wrapper carried a 24px offset that dropped the button below the logo.
       It must stay position:relative — .nav-button is absolute with top/left 50%,
       so a static wrapper sends it to the centre of the whole bar, on top of the
       logo. Give it an explicit box instead and reset the offset. */
    .bt-header .nav-button-wrap{
        position:relative !important; top:0 !important; margin:0 !important;
        display:block !important; width:36px; height:36px;
    }
    /* the button centres with a -6px margin sized for the template's own box;
       in a 36px box that leaves it 4px low */
    .bt-header .nav-button{ margin-top:-10px !important; }

    /* equal side columns, otherwise the centred logo is pulled off-centre by
       half the difference between the two clusters (was 30px left) */
    .bt-bar{ grid-template-columns:1fr auto 1fr !important; }
}

@media (max-width:760px){
    .bt-bar{ gap:12px; padding:0 16px; }
    .bt-bar__centre span{ font-size:17px; }
    .bt-bar__centre em{ font-size:9px; }

    /* the hero container had no horizontal padding, so the headline ran
       edge to edge with the text touching both screen borders */
    .hero-section .container{ padding-left:22px !important; padding-right:22px !important; }
}

/* the template's floating "bubbles" render as small grey dots scattered over
   the hero headline — they read as dirt on this design, not decoration */
.individual-bubble{ display:none !important; }

/* CTA cloned into the mobile sliding menu (see js/scripts.js) */
.bt-menu-cta{ margin-top:16px; }
.bt-menu-cta__btn{
    display:inline-flex !important; align-items:center; gap:9px;
    background:#a85c67 !important; color:#fff !important;
    padding:13px 22px !important; border-radius:999px;
    font-family:var(--font-title); font-weight:700; font-size:14px;
    text-decoration:none;
}
.bt-menu-cta__btn i{
    font-size:12px; color:#fff !important;
    /* the panel rotates its own submenu chevrons; don't inherit that */
    transform:none !important;
}

/* open state: the template paints the hamburger wrapper pale blue */
.bt-header .nav-button-wrap,
.bt-header .nav-button-wrap.vismobmenu_btn{ background:none !important; }

/* ---------------------------------------------------------------
   Mobile menu panel. The template anchors it at left:95px, which
   left it floating in the middle of a phone screen. Anchor it under
   the hamburger instead and give it a card treatment.
   --------------------------------------------------------------- */
@media (max-width:1150px){
    .bt-header .main-menu{
        left:16px !important; right:auto !important;
        top:calc(100% + 8px) !important;
        max-width:calc(100vw - 32px) !important;
        border:1px solid #e6e6e8; border-radius:14px;
        box-shadow:0 18px 44px rgba(23,25,28,.16);
        overflow:hidden; padding:8px 0 !important;
    }

    /* open state: the template collapses the bars to 0x0, so the control
       vanished while the menu was open and there was nothing to close it
       with. Turn them into an X instead. */
    .bt-header .nav-button-wrap.vismobmenu_btn .nav-button span{
        display:block !important;
        width:22px !important; height:2px !important;
        background:#17191c !important; opacity:1 !important;
        transition:transform .2s ease, opacity .2s ease;
    }
    .bt-header .nav-button-wrap.vismobmenu_btn .nav-button span:nth-child(1){
        transform:translateY(6px) rotate(45deg) !important;
    }
    .bt-header .nav-button-wrap.vismobmenu_btn .nav-button span:nth-child(2){
        opacity:0 !important;
    }
    .bt-header .nav-button-wrap.vismobmenu_btn .nav-button span:nth-child(3){
        transform:translateY(-6px) rotate(-45deg) !important;
    }
}

/* ===============================================================
   DESIGN SYSTEM PASS — BRIEF.md 2026-08-16.
   Ink-first, blush only on money actions. Two button tiers.
   Cream bands. Solid search card on a darker scrim. Quiet motion.
   =============================================================== */

:root{
    --ink:#17191c; --grey:#6b6e73; --line:#e6e6e8;
    --cream:#f7f5f2; --blush:#a85c67; --blush-dark:#8f4c56;
}

/* ---- button system: pill = primary, 8px outline = secondary ---- */
.bt-btn-primary{
    display:inline-flex; align-items:center; justify-content:center; gap:9px;
    padding:14px 26px; border-radius:999px; border:0; cursor:pointer;
    background:var(--blush); color:#fff !important;
    font-family:var(--font-title); font-weight:700; font-size:14px; line-height:1;
    transition:background .18s ease, transform .18s ease;
}
.bt-btn-primary:hover{ background:var(--ink); color:#fff !important; }
.bt-btn-secondary{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:11px 20px; border-radius:8px; cursor:pointer;
    background:transparent; color:var(--ink) !important;
    border:1px solid #d8d4d0;
    font-family:var(--font-title); font-weight:600; font-size:13px; line-height:1;
    transition:background .18s ease, border-color .18s ease, color .18s ease;
}
.bt-btn-secondary:hover{ background:var(--ink); border-color:var(--ink); color:#fff !important; }

/* ---- ink-first: strip blush from non-money surfaces ---- */
.bt-tx__i{ stroke:#7c7f84; }                 /* treatment chip icons: ink-grey */
.bt-card__pin{ stroke:#9a9da2; }             /* location pin: quieter still */
.section-separator:before{ background:var(--ink) !important; }
.header-search_btn i, .show-reg-form i{ color:var(--ink) !important; }
.bt-logo em{ color:var(--blush); }           /* the one blush accent that stays in chrome */

/* ---- hero: darker scrim low where the search card sits ---- */
.hero-section .overlay.op7{
    opacity:1 !important;
    background:linear-gradient(180deg,
        rgba(23,25,28,.30) 0%, rgba(23,25,28,.34) 45%, rgba(23,25,28,.62) 100%) !important;
}

/* ---- search card: solid white, dark text (was translucent glass).
   .rs.rs: registry-search.css loads after this sheet, so plain .rs loses
   on source order — doubling the class wins on specificity instead. ---- */
.rs.rs{
    --rs-fg:#17191c;
    --rs-fg-dim:rgba(23,25,28,.55);
    --rs-fg-faint:rgba(23,25,28,.40);
    --rs-tint:rgba(255,255,255,.96);
    --rs-tint-focus:#ffffff;
    --rs-edge:rgba(23,25,28,.08);
    --rs-edge-soft:rgba(23,25,28,.08);
    --rs-panel:#ffffff;
    --rs-btn:#a85c67;                        /* search = money action = blush */
    --rs-btn-fg:#ffffff;
    --rs-blur:8px;
}
.rs__bar{
    box-shadow:0 18px 48px -18px rgba(0,0,0,.45);
}
.rs .rs__panel, .rs__panel{
    color:#17191c;
    box-shadow:0 24px 56px -20px rgba(0,0,0,.35);
}

/* ---- cream section bands on the homepage rhythm ---- */
.slw-sec{ background:var(--cream); }                       /* verified strip */
section.bt-verify{ background:var(--cream); }
section.bt-bodies{ background:var(--cream); }
.gray-bg{ background:var(--cream) !important; }            /* template grey → cream */
.bt-lead-hero{ background:var(--cream); padding:120px 0 46px; }

/* ---- lighten dark utility UI (filters, sort, view toggles) ---- */
.toggle-filter-btn, .list-main-wrap-opt, .listsearch-input-wrap_contrl{
    background:#fff !important; color:var(--ink) !important;
    border:1px solid var(--line) !important;
}
.toggle-filter-btn{ border-radius:999px !important; padding:10px 18px !important; }
.toggle-filter-btn i, .toggle-filter-btn span{ color:var(--ink) !important; }
.grid-opt li span{ background:#fff !important; color:var(--ink) !important; border:1px solid var(--line) !important; }
.grid-opt li span.act-grid-opt{ background:var(--ink) !important; color:#fff !important; border-color:var(--ink) !important; }

/* ---- quiet motion everywhere ---- */
a, button{ transition:color .16s ease, background-color .16s ease, border-color .16s ease; }
.bt-member{ transition:transform .18s ease, box-shadow .18s ease; }
.bt-member:hover{ transform:translateY(-3px); box-shadow:0 14px 34px -14px rgba(23,25,28,.18); }

/* ===============================================================
   New page components (lead form / checks / pricing)
   =============================================================== */
.bt-lead-section, .bt-checks-section, .bt-pricing-section{ padding:56px 0 90px; background:#fff; }
.bt-lead-grid{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:start; text-align:left; }
.bt-lead-side h3, .bt-not-checked h3, .bt-price-compare h3{
    font-family:var(--font-title); font-size:22px; margin:0 0 18px; color:var(--ink);
}
.bt-lead-steps{ list-style:none; margin:0; padding:0; counter-reset:step; }
.bt-lead-steps li{
    counter-increment:step; position:relative; padding:0 0 22px 52px;
    color:var(--grey); font-size:15px; line-height:1.55;
}
.bt-lead-steps li strong{ color:var(--ink); display:block; margin-bottom:2px; }
.bt-lead-steps li:before{
    content:counter(step); position:absolute; left:0; top:2px;
    width:34px; height:34px; border-radius:50%; border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    font-family:var(--font-title); font-weight:700; font-size:14px; color:var(--ink); background:#fff;
}
.bt-lead-steps a{ color:var(--blush); }
.bt-lead-aside{ color:var(--grey); font-size:13.5px; border-top:1px solid var(--line); padding-top:18px; }

.bt-form{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:34px; }
.bt-form__row{ margin-bottom:18px; }
.bt-form__row--2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.bt-form label{ display:block; font-family:var(--font-title); font-weight:600; font-size:13px; color:var(--ink); }
.bt-form label span{ color:var(--grey); font-weight:400; }
.bt-form input[type="text"], .bt-form input[type="email"], .bt-form input[type="tel"], .bt-form textarea{
    width:100%; margin-top:7px; padding:12px 14px;
    border:1px solid var(--line); border-radius:8px; background:#fff;
    font-size:14.5px; color:var(--ink); line-height:1.4;
    transition:border-color .16s ease;
}
.bt-form input:focus, .bt-form textarea:focus{ outline:none; border-color:var(--ink); }
.bt-form__tx{ border:0; padding:0; margin:0 0 18px; }
.bt-form__tx legend{ font-family:var(--font-title); font-weight:600; font-size:13px; color:var(--ink); margin-bottom:10px; }
.bt-form__tx-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.bt-form__tx-item{ position:relative; display:block; }
.bt-form__tx-item input{ position:absolute; opacity:0; }
.bt-form__tx-item span{
    display:block; text-align:center; padding:9px 6px; border:1px solid var(--line);
    border-radius:8px; font-size:13px; color:var(--ink); cursor:pointer;
    transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.bt-form__tx-item input:checked + span{ background:var(--ink); border-color:var(--ink); color:#fff; }
.bt-form__tx-item input:focus-visible + span{ outline:2px solid var(--blush); outline-offset:1px; }
.bt-form #lf-website{ position:absolute; left:-9999px; height:0; width:0; border:0; padding:0; }
.bt-form .bt-btn-primary{ width:100%; }
.bt-form__err{ color:var(--blush); font-size:13.5px; margin:12px 0 0; min-height:1em; }
.bt-form__done h3{ font-family:var(--font-title); font-size:22px; color:var(--ink); margin:0 0 10px; }
.bt-form__done p{ color:var(--grey); font-size:15px; }

.bt-checks-table{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden; text-align:left; }
/* The markup class is .bt-checks-row, not .bt-check — these three rules were
   dead and the five cells rendered with NO background and NO padding, so the
   grid's 1px gap colour showed through as one flat grey slab with the text
   hard against its edge. Nothing errored; it just looked like a design. */
.bt-checks-row{ background:#fff; padding:28px 30px; }
.bt-checks-row h3{ font-family:var(--font-title); font-size:17px; margin:0 0 8px; color:var(--ink); }
.bt-checks-row p{ color:var(--grey); font-size:14.5px; line-height:1.55; margin:0; }
.bt-not-checked{ margin-top:26px; background:var(--cream); border-radius:14px; padding:30px 34px; text-align:left; }
.bt-not-checked p{ color:var(--grey); font-size:14.5px; line-height:1.6; margin:0; }
.bt-checks-cta{ margin-top:44px; text-align:center; }
.bt-checks-cta p{ color:var(--grey); margin-bottom:16px; }

.bt-pricing-section .container{ max-width:960px; }
.bt-price-card{
    max-width:520px; margin:0 auto; background:#fff; border:1px solid var(--line);
    border-radius:16px; padding:38px 40px; text-align:left;
    box-shadow:0 22px 54px -28px rgba(23,25,28,.18);
}
.bt-price-card__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.bt-price-card__tier{ font-family:var(--font-title); font-weight:700; font-size:17px; color:var(--ink); }
.bt-price-card__badge{
    font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:700;
    color:var(--blush); border:1px solid currentColor; border-radius:999px; padding:4px 11px;
}
.bt-price-card__price{ margin-bottom:22px; }
.bt-price-card__price strong{ font-family:var(--font-title); font-size:52px; font-weight:600; color:var(--ink); letter-spacing:-.02em; }
.bt-price-card__price span{ color:var(--grey); font-size:16px; }
.bt-price-card__list{ list-style:none; margin:0 0 26px; padding:0; }
.bt-price-card__list li{
    position:relative; padding:9px 0 9px 30px; color:#3c3f44; font-size:14.5px;
    border-bottom:1px solid #f0eeeb;
}
.bt-price-card__list li:last-child{ border-bottom:0; }
.bt-price-card__list li:before{
    content:""; position:absolute; left:2px; top:14px; width:14px; height:9px;
    border-left:2px solid var(--blush); border-bottom:2px solid var(--blush);
    transform:rotate(-45deg);
}
.bt-price-card__list a{ color:var(--blush); }
.bt-price-card__cta{ width:100%; }
.bt-price-card__foot{ margin:16px 0 0; color:var(--grey); font-size:13px; text-align:center; }
.bt-price-compare{ max-width:640px; margin:46px auto 0; text-align:center; }
.bt-price-compare p{ color:var(--grey); font-size:15px; line-height:1.65; }

@media (max-width:860px){
    .bt-lead-grid{ grid-template-columns:1fr; gap:40px; }
    .bt-checks-table{ grid-template-columns:1fr; }
    .bt-form{ padding:24px 20px; }
    .bt-form__row--2{ grid-template-columns:1fr; gap:0; }
    .bt-form__row--2 label + label{ margin-top:18px; display:block; }
    .bt-form__tx-grid{ grid-template-columns:repeat(2,1fr); }
    .bt-price-card{ padding:30px 24px; }
    .bt-lead-hero{ padding:104px 0 36px; }
}

/* ---- example-listing note (BRIEF honesty line) ---- */
.bt-example-note{
    font-size:12px; letter-spacing:.06em; text-transform:uppercase;
    color:var(--grey); margin:0 0 14px; text-align:center;
}
.list-main-wrap-opt + .bt-example-note{ text-align:left; }

/* ---- minimal footer ---- */
.bt-footer{ background:var(--ink); color:#cfd1d4; padding:64px 0 0; }
/* six link columns after the hair expansion — seven across a 1140px container
   is unreadable, so the brand takes its own row and the columns get equal width */
.bt-footer__grid{
    display:grid; grid-template-columns:repeat(6, 1fr); gap:30px 26px;
    padding-bottom:48px; text-align:left;
}
.bt-footer__brand{ grid-column:1 / -1; max-width:460px; margin-bottom:6px; }
.bt-footer__brand p{ color:#9a9da2; font-size:13.5px; line-height:1.6; margin:14px 0 0; max-width:280px; }
.bt-footer .bt-logo--footer span{ color:#fff; font-size:20px; }
.bt-footer .bt-logo--footer em{ color:#e3b5b9; }
.bt-footer__col h4{
    font-family:var(--font-title); color:#fff; font-size:13px; letter-spacing:.05em;
    margin:4px 0 14px; font-weight:700;
}
.bt-footer__col a{
    display:block; color:#9a9da2; font-size:13.5px; padding:5px 0;
    transition:color .16s ease;
}
.bt-footer__col a:hover{ color:#fff; }
.bt-footer__base{
    display:flex; justify-content:space-between; align-items:center; gap:20px;
    border-top:1px solid rgba(255,255,255,.09); padding:20px 0 26px;
    font-size:12.5px; color:#7c7f84;
}
@media (max-width:860px){
    .bt-footer__grid{ grid-template-columns:1fr 1fr; gap:30px; }
    .bt-footer__base{ flex-direction:column; align-items:flex-start; gap:6px; }
}

/* ---- map pins: the only colour on the greyscale map ---- */
.bt-pin{
    width:16px; height:16px; border-radius:50%;
    background:var(--blush); border:2.5px solid #fff;
    box-shadow:0 1px 6px rgba(23,25,28,.35); cursor:pointer;
    transition:transform .15s ease;
}
.bt-pin:hover{ transform:scale(1.25); }
.maplibregl-popup-content{ border-radius:12px; padding:0; overflow:hidden; box-shadow:0 10px 30px -8px rgba(23,25,28,.3); }
.bt-pin-pop{ display:block; width:190px; text-decoration:none; }
.bt-pin-pop img{ width:100%; height:92px; object-fit:cover; display:block; }
.bt-pin-pop strong{ display:block; padding:10px 13px 2px; font-family:var(--font-title); font-size:14px; color:var(--ink); }
.bt-pin-pop span{ display:block; padding:0 13px 12px; font-size:12px; color:var(--grey); }
#map-main{ background:#eceae7; }

/* placeholders were hardcoded cream in registry-search.css — invisible on the
   now-white card */
.rs.rs .rs__input::placeholder{ color:rgba(23,25,28,.40); }
.rs.rs .rs__input{ color:#17191c; }

/* the visible "Filters" toggle is .show-hidden-sb, not .toggle-filter-btn */
.show-hidden-sb{
    background:#fff !important; color:var(--ink) !important;
    border:1px solid var(--line) !important; border-radius:999px !important;
}
.show-hidden-sb i, .show-hidden-sb span{ color:var(--ink) !important; }

/* new-page hero titles: template's big-title h2 is grey by default */
.bt-lead-hero .section-title h2{ color:var(--ink); }
.bt-lead-hero .section-title p{ color:var(--grey); font-size:16px; max-width:560px; margin:14px auto 0; }

/* section titles: ink, not the template grey */
.section-title h2{ color:var(--ink) !important; }

/* ---- profile page (therapist.html) ---- */
.bt-profile-cat{
    display:inline-block; font-family:var(--font-title); font-weight:600;
    font-size:13.5px; color:#fff; letter-spacing:.02em;
    background:rgba(23,25,28,.35); border:1px solid rgba(255,255,255,.25);
    border-radius:999px; padding:8px 16px; backdrop-filter:blur(6px);
}
.bt-vet-record{ margin:0; padding:0; }
.bt-vet-record li{
    display:grid; grid-template-columns:150px 1fr auto; gap:14px; align-items:baseline;
    padding:13px 0; border-bottom:1px solid #f0eeeb; text-align:left;
}
.bt-vet-record li:last-child{ border-bottom:0; }
.bt-vet-record strong{ font-family:var(--font-title); font-size:14px; color:var(--ink); }
.bt-vet-record span{ color:var(--grey); font-size:14px; line-height:1.5; }
.bt-vet-record em{ font-style:normal; font-size:12px; color:#9a9da2; white-space:nowrap; }
.bt-vet-note{ margin:14px 0 0; font-size:13px; color:var(--grey); text-align:left; }
.bt-vet-note a{ color:var(--blush); }
@media (max-width:640px){
    .bt-vet-record li{ grid-template-columns:1fr; gap:2px; }
    .bt-vet-record em{ white-space:normal; }
}

/* accreditation strip: real body logos, greyscaled to sit quietly in the
   ink-first system; true colour on hover */
.bt-bodies__list--logos{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:40px 48px; }
.bt-bodies__list--logos li{ display:flex; align-items:center; }
.bt-bodies__list--logos img{
    height:40px; width:auto; max-width:150px; object-fit:contain;
    filter:grayscale(1) opacity(.62); transition:filter .2s ease;
}
.bt-bodies__list--logos li:hover img{ filter:grayscale(0) opacity(1); }
/* squarer marks read bigger than wordmarks at equal height — trim them */
.bt-bodies__list--logos img[src*="cibtac"]{ height:52px; }
.bt-bodies__list--logos img[src*="cityguilds"]{ height:48px; }
.bt-bodies__list--logos img[src*="vtct"]{ height:34px; }
@media (max-width:760px){
    .bt-bodies__list--logos{ gap:26px 30px; }
    .bt-bodies__list--logos img{ height:30px; }
    .bt-bodies__list--logos img[src*="cibtac"]{ height:40px; }
    .bt-bodies__list--logos img[src*="cityguilds"]{ height:36px; }
}
/* CIDESCO's mark is pale — needs contrast help under the greyscale treatment */
.bt-bodies__list--logos img[src*="cidesco"]{ filter:grayscale(1) contrast(2.2) opacity(.78); height:48px; }
.bt-bodies__list--logos li:hover img[src*="cidesco"]{ filter:grayscale(0) contrast(1) opacity(1); }

/* example flag on generated profiles */
.bt-example-flag{
    display:inline-block; margin-left:14px; padding:3px 11px;
    border:1px solid #f0e3bb; background:#fff8e8; color:#8a6d1d;
    border-radius:999px; font-size:11px; letter-spacing:.05em; text-transform:uppercase;
}

/* generated profiles rotate photos; guarantee the name reads on light ones */
.listing-hero-section .overlay{
    opacity:1 !important;
    background:linear-gradient(180deg, rgba(23,25,28,.16) 0%, rgba(23,25,28,.30) 55%, rgba(23,25,28,.58) 100%) !important;
}

/* listing-page fixes seen at desktop top */
/* 1. hero title sits on a photo — white there, ink stays for on-cream heroes */
.parallax-section .section-title h2{ color:#fff !important; }
/* 2. filter/category tab pair was near-black */
.filter-sidebar-header .tabs-menu li a{
    background:#fff !important; color:var(--ink) !important;
    border:1px solid var(--line) !important;
}
.filter-sidebar-header .tabs-menu li.current a{
    background:var(--cream) !important; color:var(--ink) !important;
    border-color:#d8d4d0 !important;
}
.filter-sidebar-header .tabs-menu li a i{ color:var(--blush) !important; }
/* 3. sidebar Search = money action = blush pill */
.header-search-button.color-bg, .header-search-button{
    background:var(--blush) !important; color:#fff !important;
    border-radius:999px !important; border:0 !important;
}
.header-search-button:hover{ background:var(--ink) !important; }
/* the Filters tab gets its black from the color2-bg cluster targeting
   .inline-lsiw .listsearch-input-wrap_contrl li.current a — match it exactly */
.listsearch-input-wrap_contrl li a,
.inline-lsiw .listsearch-input-wrap_contrl li a,
.inline-lsiw .listsearch-input-wrap_contrl li.current a{
    background:#fff !important; color:var(--ink) !important;
    border:1px solid var(--line) !important;
}
.inline-lsiw .listsearch-input-wrap_contrl li.current a{
    background:var(--cream) !important; border-color:#d8d4d0 !important;
}
.listsearch-input-wrap_contrl li a i{ color:var(--blush) !important; }

/* ---- listed vs verified ---- */
/* card photo chip, only on verified members */
.bt-vbadge{
    position:absolute; top:12px; left:12px; z-index:3;
    display:inline-flex; align-items:center; gap:6px;
    padding:5px 12px; border-radius:999px;
    background:rgba(23,25,28,.82); color:#fff;
    font-family:var(--font-title); font-weight:600; font-size:11.5px;
    letter-spacing:.03em; backdrop-filter:blur(4px);
}
.bt-vbadge svg{ width:12px; height:12px; fill:none; stroke:#e3b5b9; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.geodir-category-img-wrap{ position:relative; }

/* profile hero pill */
.bt-profile-vbadge{
    display:inline-flex; align-items:center; gap:7px;
    padding:8px 16px; border-radius:999px; margin-right:10px;
    background:#fff; color:#17191c;
    font-family:var(--font-title); font-weight:600; font-size:13px;
}
.bt-profile-vbadge svg{ width:13px; height:13px; fill:none; stroke:#a85c67; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.bt-profile-vbadge--none{
    background:rgba(23,25,28,.35); color:#fff;
    border:1px solid rgba(255,255,255,.25); backdrop-filter:blur(6px); font-weight:500;
}

/* unverified profile: the credentials panel's honest empty state */
.bt-unverified{ text-align:left; }
.bt-unverified__lead{
    font-family:var(--font-title); font-weight:600; font-size:17px;
    color:var(--ink); margin:0 0 10px !important;
}
.bt-unverified p{ color:var(--grey); font-size:14.5px; line-height:1.6; margin:0 0 10px; }
.bt-unverified a{ color:var(--blush); }

/* nearby-list tick */
.bt-mini-tick{ color:#a85c67; font-weight:700; font-size:13px; }

/* member sign-in, header right cluster */
.bt-signin{
    display:inline-flex; align-items:center; gap:7px;
    font-family:var(--font-title); font-weight:500; font-size:14px;
    color:var(--ink) !important; line-height:1;
}
.bt-signin i{ font-size:15px; color:var(--ink); }
.bt-signin:hover, .bt-signin:hover i{ color:var(--blush) !important; }
@media (max-width:1150px){
    .bt-signin span{ display:none; }  /* icon only beside the burger-bar logo */
    .bt-signin{ margin-right:2px; }
}

/* ---- homepage coverage map ---- */
.bt-homemap{
    display:block; width:100%; height:440px; border-radius:16px; overflow:hidden;
    border:1px solid var(--line); margin-bottom:40px; background:#eceae7;
}
/* desaturate the TILES, never the container — a filter on the container makes
   it a containing block and skews Leaflet's tile-origin maths (+430px drift) */
.bt-homemap .leaflet-tile{ filter:saturate(.55); }
.bt-homemap .leaflet-popup-content-wrapper{ border-radius:10px; box-shadow:0 8px 26px rgba(23,25,28,.16); }
.bt-homemap .leaflet-popup-content{ font-family:var(--font-body); margin:12px 15px; line-height:1.45; }
@media (max-width:760px){ .bt-homemap{ height:300px; margin-bottom:26px; } }

/* ---- clinic invitation band ---- */
.bt-join{ background:var(--ink); padding:90px 0 96px; }
.bt-join__inner{ max-width:760px; margin:0 auto; text-align:center; }
.bt-join__eyebrow{
    font-family:var(--font-title); font-weight:600; font-size:12px;
    letter-spacing:.14em; text-transform:uppercase; color:#e3b5b9; margin:0 0 18px;
}
.bt-join h2{
    color:#fff; font-size:40px; line-height:1.12; letter-spacing:-.02em; margin:0 0 30px;
}
.bt-join__points{ list-style:none; margin:0 0 36px; padding:0; }
.bt-join__points li{
    color:#c9cacd; font-size:16px; padding:10px 0;
    border-bottom:1px solid rgba(255,255,255,.09);
}
.bt-join__points li:first-child{ border-top:1px solid rgba(255,255,255,.09); }
.bt-join__points strong{ color:#fff; font-weight:600; }
.bt-join__cta{ display:flex; gap:22px; align-items:center; justify-content:center; flex-wrap:wrap; }
.bt-join__btn{
    display:inline-flex; align-items:center; justify-content:center;
    background:var(--blush); color:#fff !important;
    font-family:var(--font-title); font-weight:600; font-size:15.5px;
    padding:16px 34px; border-radius:999px;
    transition:background .18s ease, transform .18s ease;
}
.bt-join__btn:hover{ background:#fff; color:var(--ink) !important; transform:translateY(-1px); }
.bt-join__link{ color:#c9cacd !important; font-size:14.5px; border-bottom:1px solid rgba(255,255,255,.25); padding-bottom:2px; }
.bt-join__link:hover{ color:#fff !important; border-color:#fff; }
@media (max-width:760px){
    .bt-join{ padding:62px 0 66px; }
    .bt-join h2{ font-size:29px; }
    .bt-join__points li{ font-size:14.5px; }
}

/* template ornaments that read as broken empty pills on the cream ground */
.sec-circle{ display:none !important; }
.tc-pagination2, .tc-pagination{
    background:transparent !important; box-shadow:none !important; border:0 !important;
    width:auto !important; min-width:0 !important;
}

/* five checks in a two-column panel: let the odd one span, not dangle */
.bt-checks-table .bt-checks-row:last-child{ grid-column:1 / -1; }

/* legal pages */
.bt-legal{ max-width:720px; margin:0 auto; text-align:left; }
.bt-legal__draft{
    display:inline-block; padding:6px 14px; border-radius:999px; margin-bottom:26px;
    background:#fff8e8; border:1px solid #f0e3bb; color:#8a6d1d;
    font-family:var(--font-title); font-weight:600; font-size:12px; letter-spacing:.06em; text-transform:uppercase;
}
.bt-legal h3{ font-size:18px; font-weight:600; margin:30px 0 8px; letter-spacing:-.01em; }
.bt-legal p{ color:var(--grey); font-size:15px; line-height:1.7; margin:0 0 12px; }
.bt-legal strong{ color:var(--ink); }
.bt-footer__legal{ color:#9a9da2 !important; font-size:12.5px; margin-right:14px; }
.bt-footer__legal:hover{ color:#fff !important; }

/* ===============================================================
   Editorial surface — treatment guides, town pages, hubs.
   Built by tools/build-content.py; never hand-edit those pages.
   =============================================================== */
.bt-crumbs-wrap{ background:var(--cream); padding:22px 0 0; }
.bt-crumbs-wrap .breadcrumbs{ font-size:13px; }
/* the template parks a decorative Font Awesome glyph (\f14c) at the right end of
   every inline breadcrumb bar — it means nothing and reads as a broken icon */
.breadcrumbs.inline-breadcrumbs:before, .top-breadcrumbs .container:before{ content:none; }

/* the article sits directly in .content (no .container), so it carries its own
   gutter — without this it runs edge-to-edge on phones */
.bt-guide{ max-width:804px; margin:0 auto; padding:44px 22px 80px;
           box-sizing:border-box; text-align:left; }

/* --- base typography, declared FIRST -------------------------------------
   `.bt-guide p` is specificity 0,1,1. Every single-class component below it
   (.bt-guide__eyebrow, .bt-updated, .bt-strip__empty …) is 0,1,0 and therefore
   LOSES to it regardless of source order. That silently flattened the eyebrow,
   the front-loaded answer and the review line to plain grey body text on every
   editorial page. Component rules that style a <p> are written `.bt-guide .x`
   (0,2,0) so they win on specificity rather than on !important. */
.bt-guide h1{ font-size:37px; line-height:1.14; letter-spacing:-.025em; margin:0 0 20px; }
.bt-guide h2{ font-size:24px; letter-spacing:-.02em; margin:0 0 14px; }
.bt-guide h3{ font-size:17px; margin:22px 0 8px; }
.bt-guide p{ font-size:16px; line-height:1.68; color:var(--grey); margin:0 0 14px; }
.bt-guide p strong, .bt-guide li strong{ color:var(--ink); }
.bt-guide a{ color:var(--blush); }
/* the template gives every <section> 100px of vertical padding; these pages are
   built out of sections, so each block was carrying 200px of dead space */
.bt-guide section{ padding:0; }

.bt-guide__head{ margin-bottom:38px; }
.bt-guide .bt-guide__eyebrow{
    font-family:var(--font-title); font-weight:600; font-size:11.5px;
    letter-spacing:.14em; text-transform:uppercase; color:var(--blush); margin:0 0 12px;
}
/* the front-loaded answer: first thing a reader — or an AI — reads */
.bt-guide .bt-guide__answer{
    font-size:18.5px; line-height:1.6; color:var(--ink); margin:0 0 18px;
    padding-left:18px; border-left:3px solid var(--blush);
}
.bt-updated{ font-size:13px; color:var(--grey); margin:0; }
.bt-guide .bt-updated{ font-size:13px; color:var(--grey); margin:0; }
.bt-updated a{ color:var(--blush); }

.bt-guide__block{ margin:0 0 38px; }

/* regulation block — the differentiator, so it carries weight */
.bt-guide .bt-reg,
.bt-reg{
    background:#fff; border:1px solid var(--line); border-left:4px solid var(--grey);
    border-radius:14px; padding:26px 28px; margin:0 0 38px;
}
.bt-reg--amber{ border-left-color:#d9a441; }
.bt-reg--green{ border-left-color:#4f9d69; }
.bt-reg--out{   border-left-color:#b9bcc1; }
.bt-reg--scope{ border-left-color:#3b5bd9; }
.bt-reg--mixed{ border-left-color:#a85c67; }
.bt-reg__head{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.bt-reg__head h2{ margin:0; font-size:20px; }
.bt-reg__badge{
    font-family:var(--font-title); font-weight:600; font-size:11px; letter-spacing:.08em;
    text-transform:uppercase; padding:5px 12px; border-radius:999px;
    background:var(--cream); color:var(--ink); border:1px solid var(--line);
}
.bt-reg--amber .bt-reg__badge{ background:#fdf5e6; border-color:#f0e0bb; color:#8a6d1d; }
.bt-reg--green .bt-reg__badge{ background:#eef7f0; border-color:#bfe0c9; color:#2e7d4f; }
.bt-guide .bt-reg__src, .bt-reg__src{ font-size:13px; color:#9a9da2; margin:14px 0 0; }

/* prices — first-party data, so it looks like data */
.bt-guide .bt-price{ font-size:17px; }
.bt-price__band{ font-family:var(--font-title); font-weight:600; font-size:23px; color:var(--ink); }
.bt-price__n{ font-size:13.5px; color:var(--grey); display:block; margin-top:3px; }
.bt-guide .bt-price__note{ font-size:13.5px; color:#9a9da2; }

.bt-list ol, .bt-list ul{ margin:0; padding-left:22px; }
.bt-list li{ font-size:16px; line-height:1.6; color:var(--grey); margin-bottom:9px; }
.bt-list--flags li::marker{ color:var(--blush); }

.bt-guide .bt-faq,
.bt-faq{ margin:0 0 38px; border-top:1px solid var(--line); padding-top:30px; }
.bt-faq__item{ padding:18px 0; border-bottom:1px solid var(--line); }
.bt-faq__item h3{ margin:0 0 8px; font-size:17.5px; }
.bt-faq__item p{ margin:0; }

.bt-strip{ margin:0 0 38px; }
.bt-strip__list{ list-style:none; margin:0; padding:0; display:grid;
    grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; }
.bt-strip__list a{
    display:block; padding:14px 16px; border:1px solid var(--line); border-radius:11px;
    background:#fff; color:var(--ink) !important; transition:border-color .15s ease;
}
.bt-strip__list a:hover{ border-color:var(--ink); }
.bt-strip__list strong{ display:block; font-family:var(--font-title); font-size:15.5px; }
.bt-strip__list span{ font-size:13px; color:var(--grey); }
.bt-guide .bt-strip__empty{ font-size:15px; }

.bt-linklist{ list-style:none; margin:0; padding:0; columns:2; column-gap:26px; }
.bt-linklist li{ margin-bottom:9px; break-inside:avoid; font-size:15.5px; }

.bt-cardgrid{ list-style:none; margin:0; padding:0; display:grid;
    grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px; }
.bt-cardgrid a{
    display:block; padding:18px 20px; border:1px solid var(--line); border-radius:13px;
    background:#fff; color:var(--ink) !important;
}
.bt-cardgrid a:hover{ border-color:var(--ink); }
.bt-cardgrid strong{ display:block; font-family:var(--font-title); font-size:16.5px; margin-bottom:5px; }
.bt-cardgrid span{ font-size:12.5px; color:var(--grey); }

.bt-tablewrap{ overflow-x:auto; }
.bt-table{ width:100%; border-collapse:collapse; background:#fff;
    border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.bt-table th{
    text-align:left; font-size:11px; letter-spacing:.07em; text-transform:uppercase;
    color:var(--grey); padding:13px 15px; border-bottom:1px solid var(--line); font-weight:600;
}
.bt-table td{ padding:13px 15px; border-bottom:1px solid var(--line); font-size:14.5px; color:var(--grey); }
.bt-table tr:last-child td{ border-bottom:0; }

.bt-chip{
    display:inline-block; padding:7px 15px; border-radius:999px; margin:0 6px 6px 0;
    border:1px solid var(--line); background:#fff; font-size:14px; color:var(--ink) !important;
}
.bt-chip:hover{ border-color:var(--ink); }

.bt-sources{ border-top:1px solid var(--line); padding-top:26px; }
.bt-sources h2{ font-size:16px; }
.bt-sources__list{ padding-left:20px; }
.bt-sources__list li{ font-size:13.5px; color:var(--grey); margin-bottom:7px; }
.bt-guide .bt-guide__more{ font-size:15px; }

/* knowledge-base prose: guide blocks carry raw <ul>/<ol>, so they need
   styling here — .bt-list only covers the generated treatment-page lists */
.bt-guide__block ul, .bt-guide__block ol{ margin:0 0 16px; padding-left:22px; }
.bt-guide__block li{ font-size:16px; line-height:1.68; color:var(--grey); margin-bottom:10px; }
.bt-guide__block li::marker{ color:#b9bcc1; }
.bt-guide__block ol li::marker{ color:var(--grey); font-family:var(--font-title); font-weight:600; }
.bt-guide__block ul.bt-kb, .bt-guide__block ul.bt-linklist{ padding-left:0; }

/* a callout that has to read as a warning without shouting */
.bt-guide .bt-note{
    background:#fdf5f5; border:1px solid #f0dcde; border-left:3px solid var(--blush);
    border-radius:10px; padding:14px 16px; font-size:14.5px;
    color:var(--ink); margin:6px 0 0;
}

/* knowledge-base index cards */
.bt-kb{ list-style:none; margin:0; padding:0; display:grid;
        grid-template-columns:repeat(2,1fr); gap:12px; }
.bt-kb li{ margin:0; }
.bt-kb a{
    display:block; height:100%; box-sizing:border-box;
    padding:18px 20px; border:1px solid var(--line); border-radius:12px;
    background:#fff; color:var(--ink) !important; transition:border-color .15s ease;
}
.bt-kb a:hover{ border-color:var(--ink); }
.bt-kb strong{ display:block; font-family:var(--font-title); font-size:16px;
               line-height:1.3; margin-bottom:6px; }
.bt-kb span{ display:block; font-size:13.5px; line-height:1.55; color:var(--grey); }
.bt-guide .bt-kb__lead p{ font-size:17px; }

/* the tracker: a dated spine, because recency is the whole point of the page */
.bt-track{ list-style:none; margin:0; padding:0; border-left:2px solid var(--line); }
.bt-track__item{ position:relative; padding:0 0 30px 26px; margin:0; }
.bt-track__item:last-child{ padding-bottom:0; }
.bt-track__item:before{
    content:""; position:absolute; left:-7px; top:6px;
    width:12px; height:12px; border-radius:50%;
    background:var(--blush); border:2px solid #fff; box-shadow:0 0 0 1px var(--line);
}
.bt-track__item:first-child:before{ background:var(--ink); }
.bt-track__meta{ display:flex; align-items:center; gap:10px; margin-bottom:5px; flex-wrap:wrap; }
.bt-track__meta time{
    font-family:var(--font-title); font-weight:600; font-size:13px;
    letter-spacing:.02em; color:var(--ink);
}
.bt-track__nation{
    font-size:11px; letter-spacing:.07em; text-transform:uppercase; font-weight:600;
    padding:3px 9px; border-radius:999px; background:var(--cream);
    border:1px solid var(--line); color:var(--grey);
}
.bt-track__body h3{ margin:0 0 6px !important; font-size:17px; }
.bt-guide .bt-track__body p{ margin:0 0 6px; font-size:15.5px; }

/* end-of-guide CTA — quiet, because the page has just spent 900 words
   telling the reader to be sceptical */
.bt-guide .bt-cta,
.bt-cta{
    background:var(--cream); border:1px solid var(--line); border-radius:14px;
    padding:26px 28px; margin:0 0 38px;
}
.bt-guide .bt-cta h2{ font-size:20px; margin:0 0 10px; }
.bt-guide .bt-cta p{ font-size:15.5px; }
.bt-cta p:last-child{ margin-bottom:0; }
.bt-cta .bt-chip{ background:#fff; }

@media (max-width:760px){
    .bt-guide{ padding:26px 20px 54px; }
    .bt-guide h1{ font-size:28px; }
    .bt-guide__answer{ font-size:16.5px; }
    .bt-linklist{ columns:1; }
    .bt-reg{ padding:20px; }
    .bt-kb{ grid-template-columns:1fr; }
    .bt-guide .bt-cta{ padding:20px; }
    .bt-track__item{ padding-left:20px; }
}

/* data tables stack on phones — a 4-column table in 335px reads as clipped
   even when the wrapper scrolls, and nobody discovers the scroll */
@media (max-width:640px){
    .bt-table, .bt-table tbody, .bt-table tr, .bt-table td{ display:block; width:100%; }
    .bt-table thead{ display:none; }
    .bt-table tr{ padding:14px 15px; border-bottom:1px solid var(--line); }
    .bt-table tr:last-child{ border-bottom:0; }
    .bt-table td{ padding:3px 0; border:0; display:flex; gap:12px; align-items:baseline; }
    .bt-table td:before{
        content:attr(data-label); flex:0 0 44%;
        font-size:11px; letter-spacing:.06em; text-transform:uppercase;
        color:#9a9da2; font-weight:600;
    }
    .bt-table td:first-child{ font-size:16px; margin-bottom:4px; }
    .bt-table td:first-child:before{ display:none; }
    .bt-table td:first-child a{ font-family:var(--font-title); font-weight:600; }
}

/* ===============================================================
   Member profile: logo, business type, hours, links
   =============================================================== */
.bt-idline{ display:flex; align-items:center; gap:18px; }
.bt-idline__text{ min-width:0; }
/* a logo is never cropped and always sits on white — a transparent PNG on the
   dark hero scrim would vanish, and a solid-background one would look cut out */
.bt-idline__logo{
    flex:0 0 auto; width:78px; height:78px; border-radius:14px; background:#fff;
    border:1px solid rgba(255,255,255,.5); padding:9px; box-sizing:border-box;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 20px -8px rgba(23,25,28,.45);
}
.bt-idline__logo img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; }

.bt-typepill{
    display:inline-block; font-family:var(--font-title); font-weight:600; font-size:11px;
    letter-spacing:.08em; text-transform:uppercase; padding:5px 12px; border-radius:999px;
    background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.32);
    color:#fff; margin-right:8px; vertical-align:middle;
}

.bt-hours{ margin:0; padding:0; list-style:none; }
.bt-hours li{
    display:flex; justify-content:space-between; gap:12px; align-items:baseline;
    padding:9px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--grey);
}
.bt-hours li:last-child{ border-bottom:0; }
.bt-hours li span:first-child{ color:var(--ink); }
.bt-hours li.is-today{ font-weight:600; }
.bt-hours li.is-today span{ color:var(--ink); }
.bt-hours__note{ font-size:13px; color:var(--grey); margin:12px 0 0; }

.bt-linkrow{
    display:flex; align-items:center; gap:10px; font-size:14px;
    color:var(--ink) !important; padding:4px 0 12px; word-break:break-all;
}
.bt-linkrow i{ color:var(--blush); }
.bt-socials{ display:flex; gap:9px; flex-wrap:wrap; }
.bt-social{
    width:40px; height:40px; border-radius:50%; border:1px solid var(--line);
    display:inline-flex; align-items:center; justify-content:center;
    color:var(--ink) !important; background:#fff; transition:border-color .15s ease, background .15s ease;
}
.bt-social:hover{ border-color:var(--ink); background:var(--cream); }

@media (max-width:760px){
    .bt-idline{ gap:12px; }
    .bt-idline__logo{ width:58px; height:58px; border-radius:11px; padding:7px; }
}

/* town.html is a viewport-locked split map/list page: the map is pinned to the
   right half and the filter panel is fixed over the left, so a full-width
   footer physically cannot sit below it. This slim bar lives inside the
   scrolling list column instead — which is what the template intended, and it
   keeps Privacy and Terms reachable from a page that otherwise has no route
   to them. */
.bt-slimfoot{
    display:flex; align-items:center; gap:8px 20px; flex-wrap:wrap;
    /* inset matches the listing cards — flush to the viewport edge is the
       exact defect that started this project */
    padding:22px 26px 40px; margin:10px 8px 0;
    border-top:1px solid var(--line); font-size:13px; color:var(--grey);
}
/* no margin-left:auto — pushing the nav right ran "Terms" into the fixed map */
.bt-slimfoot nav{ display:flex; gap:8px 18px; flex-wrap:wrap; }
.bt-slimfoot a{ color:var(--grey); }
.bt-slimfoot a:hover{ color:var(--ink); }
@media (max-width:760px){
    /* keep the horizontal inset — an earlier version zeroed it here and put the
       copyright and "Terms" hard against both screen edges */
    .bt-slimfoot{ padding:18px 20px 32px; margin:10px 0 0; gap:6px 14px; }
    .bt-slimfoot nav{ gap:6px 14px; }
}

/* ===============================================================
   Member profile: services menu, team, facts
   =============================================================== */
.bt-svcgroup{ margin-bottom:26px; }
.bt-svcgroup:last-of-type{ margin-bottom:8px; }
.bt-svcgroup h4{
    font-family:var(--font-title); font-size:12px; font-weight:600; letter-spacing:.07em;
    text-transform:uppercase; color:var(--grey); margin:0 0 10px;
    padding-bottom:9px; border-bottom:1px solid var(--line);
}
.bt-svcgroup h4 span{
    display:inline-block; margin-left:6px; font-size:11px; letter-spacing:0;
    color:#9a9da2; font-weight:400;
}
.bt-svclist{ margin:0; padding:0; list-style:none; }
/* the template centres .list-single-main-item_content; a price list must be
   left-aligned or the eye cannot scan down the names */
.bt-svcgroup, .bt-svc, .bt-svc__main, .bt-facts, .bt-fact, .bt-team{ text-align:left; }
.bt-svc{
    display:grid; grid-template-columns:1fr auto auto; gap:6px 18px; align-items:baseline;
    padding:12px 0; border-bottom:1px solid var(--line);
}
.bt-svc:last-child{ border-bottom:0; }
.bt-svc__main strong{ font-family:var(--font-title); font-weight:600; font-size:15.5px; color:var(--ink); }
.bt-svc__note{ display:block; font-size:12.5px; color:var(--grey); margin-top:2px; }
.bt-svc__dur{ font-size:13px; color:var(--grey); white-space:nowrap; }
.bt-svc__price{
    font-family:var(--font-title); font-weight:600; font-size:15px; color:var(--ink);
    white-space:nowrap; text-align:right; min-width:92px;
}
.bt-svc__foot{ font-size:12.5px; color:#9a9da2; margin:16px 0 0; }

.bt-team{ margin:0; padding:0; list-style:none; display:grid;
          grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:12px; }
.bt-person{ display:flex; align-items:center; gap:12px; }
.bt-person__av{
    width:42px; height:42px; border-radius:50%; flex:0 0 auto;
    background:var(--cream); border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    font-family:var(--font-title); font-weight:600; color:var(--grey);
}
.bt-person__t strong{ display:block; font-size:14.5px; }
.bt-person__t span{ display:block; font-size:12.5px; color:var(--grey); }

.bt-facts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:20px 26px; }
.bt-fact h4{
    font-family:var(--font-title); font-size:11.5px; font-weight:600; letter-spacing:.07em;
    text-transform:uppercase; color:var(--grey); margin:0 0 5px;
}
.bt-fact p{ font-size:14.5px; margin:0; line-height:1.55; }

/* open-now sits with the address line on the hero, so it reads light on dark */
.bt-open{
    display:inline-block; font-family:var(--font-title); font-weight:600; font-size:11.5px;
    letter-spacing:.05em; text-transform:uppercase; padding:4px 11px; border-radius:999px;
    background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.3);
    color:#fff; margin-right:12px;
}
.bt-open--yes{ background:#eef7f0; border-color:#bfe0c9; color:#2e7d4f; }

@media (max-width:600px){
    .bt-svc{ grid-template-columns:1fr auto; }
    .bt-svc__dur{ grid-column:1; grid-row:2; }
    .bt-svc__price{ grid-row:1 / span 2; align-self:center; }
}

/* a member with no published services: categories only, never a price */
.bt-svc--bare{ grid-template-columns:1fr; padding:10px 0; }

/* Hero meta row: [business type] [categories] ............ [verified badge].
   The type pill must sit OUTSIDE .listing-item-category-wrap — the theme's
   `.listing-item-category-wrap span` rule floats it, blockifies it and forces
   it dark grey with !important, which broke it on every profile. */
.listing-hero-section .list-single-header_bottom{
    display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.listing-hero-section .list-single-header_bottom .bt-profile-vbadge,
.listing-hero-section .list-single-header_bottom .bt-profile-vbadge--none{
    margin-left:auto; margin-right:0;
}
@media (max-width:760px){
    .listing-hero-section .list-single-header_bottom .bt-profile-vbadge,
    .listing-hero-section .list-single-header_bottom .bt-profile-vbadge--none{
        margin-left:0;
    }
}

/* ===================================================================
   DESIGN D — "Ink & Blush"                              2026-08-18
   Two-row site header: dark top bar + category tab row.
   Markup is owned by tools/nav.py between <!--BT:HEADER--> sentinels.

   Everything here is named hb-* on purpose. The template hides the old
   menu below 1070px (.main-menu nav ul{display:none}) and below 1150px
   (.bt-header .nav-holder{display:none}), so anything reusing those
   class names disappears on phones while passing every code-level check.
   =================================================================== */

:root{
    --hb-hdr:#17191c;          /* header ground — same ink as --ink   */
    --hb-pri:#8f4c56;          /* primary action + links              */
    --hb-pri-d:#743d46;
    --hb-acc:#f0b39f;          /* the search-bar frame                */
    --hb-band:#f5f4f2;
    --hb-tint:#f8eef0;
    --hb-line:#e7e7e7;
    --hb-grey:#595959;
    --hb-green:#008009;
    --hb-gut:92%;              /* mirrors .container so the header aligns */
    --hb-max:1424px;
    --hb-hdr-h:119px;         /* 64 top bar + 55 tab row — kept exact on purpose */
}

/* --- neutralise the template's fixed 80px bar -------------------- */
/* It was position:fixed with #wrapper{padding-top:80px} compensating.
   The new header is two rows and scrolls away like Booking's, so both
   the fixed positioning and the compensating padding have to go or the
   page opens with 80px of dead space above the hero. */
/* position:RELATIVE, not static. A static element cannot take a z-index, so
   `position:static` silently voided the template's z-index:31 and town.html's
   position:relative;z-index:20 filter panel painted straight over the tab row.
   Relative keeps the header in normal flow (no offset needed) AND stacking. */
.main-header.bt-header{
    position:relative; z-index:40; height:auto; padding:0;
    background:var(--hb-hdr); box-shadow:none; transform:none; width:100%;
}
.main-header.bt-header:before{ display:none; }
#wrapper{ padding-top:0; }

/* --- top bar ----------------------------------------------------- */
.hb-top{ background:var(--hb-hdr); }
.hb-top{ height:64px; }
.hb-top__in{
    max-width:var(--hb-max); width:var(--hb-gut); margin:0 auto; height:100%;
    display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.hb-logo{ display:block; line-height:1.05; text-decoration:none; }
.hb-logo__n{
    display:block; font-family:var(--font-title); font-size:21px; font-weight:700;
    letter-spacing:-.025em; color:#fff;
}
.hb-logo__k{
    display:block; font-size:9px; font-weight:500; letter-spacing:.3em;
    text-transform:uppercase; color:rgba(255,255,255,.6); margin-top:3px;
}
.hb-logo:hover .hb-logo__n{ color:#fff; }
.hb-top__r{ display:flex; align-items:center; gap:8px; }
.hb-tlink{
    padding:8px 11px; border-radius:4px; font-size:13.5px; font-weight:500;
    color:rgba(255,255,255,.9); text-decoration:none; white-space:nowrap;
    transition:background .2s, color .2s;
}
.hb-tlink:hover{ background:rgba(255,255,255,.13); color:#fff; }
.hb-wbtn{
    background:#fff; color:var(--hb-pri); border-radius:4px; padding:9px 14px;
    font-size:13.5px; font-weight:600; text-decoration:none; white-space:nowrap;
    transition:background .2s, color .2s;
}
.hb-wbtn:hover{ background:var(--hb-tint); color:var(--hb-pri-d); }

/* --- category tabs ----------------------------------------------- */
.hb-tabs{ background:var(--hb-hdr); height:55px; }
.hb-tabs__in{
    max-width:var(--hb-max); width:var(--hb-gut); margin:0 auto; height:100%;
    display:flex; align-items:center; gap:6px;
    overflow-x:auto; overflow-y:hidden; scrollbar-width:none; -ms-overflow-style:none;
}
.hb-tabs__in::-webkit-scrollbar{ display:none; }
.hb-tab{
    display:flex; align-items:center; gap:8px; flex:none;
    border:1px solid transparent; border-radius:999px; padding:9px 15px;
    font-size:13.5px; font-weight:500; color:rgba(255,255,255,.92);
    text-decoration:none; white-space:nowrap; transition:background .2s, border-color .2s;
}
.hb-tab:hover{ background:rgba(255,255,255,.13); color:#fff; }
.hb-tab--on{ border-color:#fff; background:rgba(255,255,255,.07); color:#fff; }
.hb-tab__i{
    width:17px; height:17px; flex:none;
    fill:none; stroke:currentColor; stroke-width:1.7;
    stroke-linecap:round; stroke-linejoin:round;
}

@media (max-width:900px){
    .hb-top{ height:56px; }
    .hb-tabs{ height:49px; }
    .hb-top__in{ gap:10px; }
    .hb-logo__n{ font-size:17px; }
    .hb-logo__k{ font-size:8px; letter-spacing:.24em; }
    .hb-tlink{ display:none; }
    .hb-wbtn{ padding:8px 11px; font-size:12.5px; }
    .hb-tabs__in{ gap:5px; }
    .hb-tab{ padding:8px 13px; font-size:12.5px; }
}

/* --- pages pinned to the OLD fixed 80px header ------------------- */
/* town.html is viewport-locked: the Leaflet map and the filter panel are
   position:fixed and were hard-pinned to top:80px, and js/scripts.js:1030
   sizes the map inline as innerHeight-80. With the header now static and
   119px tall, all three painted OVER the category tabs. The map height is
   an inline style, so it needs !important to beat it — cheaper and safer
   than editing 1,200 lines of template JS. */
@media (max-width:900px){ :root{ --hb-hdr-h:105px; } }

/* SCOPED to the breakpoint where these are actually position:fixed. Applied
   globally they shift the panel DOWN 105px on mobile — where it is only
   position:relative — which opened a dead grey band and collided the town
   heading with the example-listings note. Caught by shooting 390x844. */
@media (min-width:1071px){
    .list-main-wrap-header.anim_clw,
    .hidden-search-column{ top:var(--hb-hdr-h); }
    .fixed-mobile{ top:var(--hb-hdr-h) !important; }
}
.map-container.column-map{ height:calc(100vh - var(--hb-hdr-h)) !important; }

/* --- town.html: heading collided with the example-listings note --------- */
/* PRE-EXISTING, confirmed against a pre-change baseline render — not caused
   by the header port. .list-main-wrap-title floats and its h2 is nudged down
   with position:relative;top:12px (a desktop alignment hack), while the note
   that follows never cleared the float, so the note's box began at the same y
   the h2 painted into. Clear the float, and drop the nudge where it is not
   needed. */
.bt-example-note{ clear:both; }
@media (max-width:1070px){
    .list-main-wrap-title{ float:none; width:100%; margin-bottom:8px; }
    .list-main-wrap-title h2{ float:none; top:0; }
}

/* ===================================================================
   DESIGN D — homepage                                     2026-08-18
   The template gives every <section> padding:100px 0, so each block
   below sets its own or inherits 200px of dead space between them.
   =================================================================== */
.hb-sec, .hb-seo, .hb-bb, .hb-hero{ padding:0; }
.hb-sec{ padding:44px 0; }
.hb-sec--tight{ padding-top:10px; }
.hb-h2{ font-size:26px; font-weight:700; letter-spacing:-.022em; margin:0; color:var(--ink); }
.hb-sub{ color:var(--hb-grey); margin:5px 0 0; font-size:15px; }
.hb-btn{
    display:inline-block; background:var(--hb-pri); color:#fff; border:0; border-radius:5px;
    padding:13px 22px; font-size:15px; font-weight:600; text-align:center; transition:background .2s;
}
.hb-btn:hover{ background:var(--hb-pri-d); color:#fff; }
.hb-btn--ghost{ background:#fff; color:var(--hb-pri); border:1px solid var(--hb-pri); }
.hb-btn--ghost:hover{ background:var(--hb-tint); color:var(--hb-pri-d); }
.hb-btn--gold{ background:#c9a84c; color:#141210; } .hb-btn--gold:hover{ background:#dcbb5c; color:#141210; }
.hb-more{ text-align:center; margin-top:22px; }

/* --- hero -------------------------------------------------------- */
/* the old hero was height:100svh with section.hero-section{padding:100px 0}.
   That element+class selector is 0,1,1 and beats a bare .hb-hero at 0,1,0, so
   the overrides below are written on the compound selector. */
section.hero-section.hb-hero{
    position:relative; height:auto; min-height:430px; padding:0;
    display:flex; align-items:center; justify-content:flex-start; overflow:hidden;
}
.hb-hero{ position:relative; }
.hb-hero .video-container, .hb-hero .bgvid{ position:absolute; inset:0; width:100%; height:100%; }
.hb-hero .bgvid{ object-fit:cover; }
/* lighter than the old .op7 scrim so George's footage actually reads */
.hb-hero .overlay.op7{
    opacity:1 !important; z-index:3;
    background:linear-gradient(100deg,rgba(14,15,17,.90) 0%,rgba(14,15,17,.72) 46%,rgba(23,25,28,.34) 100%) !important;
}
.hb-hero__in{ position:relative; z-index:4; padding-top:26px; padding-bottom:56px; }
.hb-hero__h{
    font-size:42px; font-weight:800; letter-spacing:-.035em; line-height:1.08;
    color:#fff; margin:0 0 10px; max-width:19em; text-shadow:0 1px 20px rgba(0,20,50,.35);
}
.hb-hero__p{
    font-size:18px; color:rgba(255,255,255,.95); margin:0; max-width:36em;
    text-shadow:0 1px 14px rgba(0,20,50,.35);
}

/* --- the straddling search bar ----------------------------------- */
/* z-index must clear .hero-section's z-index:20 or the hero paints over the
   straddling top half of the bar. Header is 40, so 30 sits between. */
.hb-searchwrap{ position:relative; z-index:30; }
.hb-searchwrap .rs__bar{
    background:var(--hb-acc); border-radius:7px; padding:4px; gap:4px;
    box-shadow:0 2px 10px rgba(23,25,28,.22); border:0;
}
.hb-searchwrap .rs__field{ background:#fff; border-radius:4px; border:0; }
.hb-searchwrap .rs__submit{
    background:var(--hb-pri); color:#fff; border-radius:4px; border:0;
    font-size:16px; font-weight:600; padding:0 30px;
}
.hb-searchwrap .rs__submit:hover{ background:var(--hb-pri-d); }
.hb-types{ display:flex; gap:8px; margin-top:13px; flex-wrap:wrap; }
.hb-type{
    border:1px solid var(--hb-line); border-radius:999px; padding:7px 15px;
    font-size:13.5px; font-weight:500; background:#fff; color:var(--ink);
}
.hb-type:hover{ border-color:var(--hb-pri); color:var(--hb-pri); }
.hb-type--on{ background:var(--hb-tint); border-color:var(--hb-pri); color:var(--hb-pri); }

/* --- why us ------------------------------------------------------ */
.hb-why{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:16px; }
.hb-why__c{ border:1px solid var(--hb-line); border-radius:9px; padding:18px; }
.hb-why__c b{ display:block; font-size:15.5px; font-weight:700; margin:11px 0 4px; }
.hb-why__c p{ margin:0; font-size:13.5px; color:var(--hb-grey); line-height:1.5; }
.hb-why__i{
    width:29px; height:29px; fill:none; stroke:var(--hb-pri); stroke-width:1.7;
    stroke-linecap:round; stroke-linejoin:round;
}

/* --- service tiles ----------------------------------------------- */
.hb-tiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:16px; }
.hb-tile{ display:block; color:var(--ink); }
.hb-tile__img{ display:block; border-radius:9px; overflow:hidden; }
.hb-tile__img img{ width:100%; height:148px; object-fit:cover; display:block; transition:transform .6s; }
.hb-tile:hover .hb-tile__img img{ transform:scale(1.04); }
.hb-tile b{ display:block; font-size:15.5px; font-weight:700; margin-top:9px; }
.hb-tile:hover b{ color:var(--hb-pri); }
.hb-tile__s{ display:block; font-size:13px; color:var(--hb-grey); }

/* --- town tiles (markup owned by tools/generate.py) --------------- */
.hb-townrow{ margin-top:16px; }
.hb-towns .listing-item-grid{ border-radius:9px; overflow:hidden; height:190px; }
.hb-towns .col-sm-4{ margin-bottom:16px; }
.hb-towns .listing-item-grid_title h3{ font-size:20px; font-weight:700; letter-spacing:-.02em; }
.hb-towns .listing-counter{ background:var(--hb-pri) !important; }

/* --- favourites (cards owned by tools/generate.py) ---------------- */
.hb-favs{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:16px; float:none; }
.hb-favs .gallery-item{ width:100%; padding:0; float:none; position:static !important;
    left:auto !important; top:auto !important; transform:none !important; }
.hb-favs .listing-item{ width:100%; padding:0; }

/* --- the black book ---------------------------------------------- */
.hb-bb{ background:#141210; color:#f2ece9; padding:46px 0 50px; }
.hb-bb__k{ font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:#c9a84c; }
.hb-bb__h{ font-size:27px; font-weight:700; letter-spacing:-.022em; margin:9px 0 0; max-width:22em; color:#f2ece9; }
.hb-bb__p{ color:#a79c97; max-width:56em; margin:11px 0 0; font-size:15px; }
.hb-bb__cta{
    display:flex; align-items:center; gap:18px; margin-top:24px; flex-wrap:wrap;
    border:1px solid #2e2a26; border-radius:9px; padding:19px 21px; background:#1c1917;
}
.hb-bb__cta p{ margin:0; font-size:14.5px; color:#c6bcb7; flex:1; min-width:260px; }
.hb-bb__cta b{ color:#f2ece9; }

/* --- clinic pitch ------------------------------------------------ */
.hb-pitch{
    border:1px solid var(--hb-line); border-radius:9px; padding:26px;
    display:grid; grid-template-columns:1.35fr 1fr; gap:34px; align-items:center; margin-top:14px;
}
.hb-steps{ margin:16px 0 0; padding:0; }
.hb-steps li{
    list-style:none; display:flex; gap:13px; align-items:baseline;
    padding:9px 0; border-top:1px solid var(--hb-line); font-size:15px;
}
.hb-steps li:first-child{ border-top:0; }
.hb-steps i{ font-style:normal; font-size:12px; font-weight:700; color:var(--hb-pri); width:22px; flex:none; }
.hb-pitch__a{ background:var(--hb-band); border-radius:9px; padding:22px; text-align:center; }
.hb-pitch__a b{ display:block; font-size:32px; font-weight:800; letter-spacing:-.03em; }
.hb-pitch__a span{ display:block; font-size:13px; color:var(--hb-grey); margin-bottom:15px; }
.hb-pitch__a .hb-btn{ width:100%; }
.hb-pitch__a small{ display:block; margin-top:9px; font-size:12px; color:var(--hb-grey); }

/* --- SEO block --------------------------------------------------- */
.hb-seo{ background:var(--hb-band); padding:34px 0 30px; }
.hb-seo__l{ columns:4; column-gap:24px; margin-top:16px; font-size:13.5px; }
.hb-seo__l a{ display:block; padding:5px 0; color:var(--hb-pri); break-inside:avoid; }
.hb-seo__l a:hover{ text-decoration:underline; }
.hb-seo__inline{
    border-top:1px solid var(--hb-line); margin-top:18px; padding-top:16px;
    font-size:13px; color:var(--hb-grey); line-height:2.05;
}
.hb-seo__inline a{ color:var(--hb-pri); }
.hb-seo__inline a:hover{ text-decoration:underline; }

@media (max-width:900px){
    section.hero-section.hb-hero{ min-height:330px; }
    .hb-hero__h{ font-size:28px; }
    .hb-hero__p{ font-size:15.5px; }
    .hb-hero__in{ padding-bottom:46px; }
    .hb-sec{ padding:32px 0; }
    .hb-h2{ font-size:21px; }
    .hb-why, .hb-tiles, .hb-favs{ grid-template-columns:1fr 1fr; gap:12px; }
    .hb-tile__img img{ height:116px; }
    .hb-bb__h{ font-size:21px; }
    .hb-pitch{ grid-template-columns:1fr; gap:22px; padding:20px; }
    .hb-seo__l{ columns:2; }
    .hb-searchwrap{ margin-top:-22px; }
}

/* --- design D homepage: corrections found by rendering ------------------ */
/* 1. the hero kept flex-direction:column from the old rule, so align-items:center
      was centring HORIZONTALLY and justify-content:flex-start pinned the copy to
      the top of a 430px box. */
section.hero-section.hb-hero{ flex-direction:column; justify-content:center; align-items:stretch; }
/* 2. the template centres text inside hero/sections; design D is left-aligned. */
.hb-hero__in, .hb-sec .container, .hb-seo .container, .hb-bb .container{ text-align:left; }
.hb-why__c, .hb-tile, .hb-pitch{ text-align:left; }
.hb-pitch__a{ text-align:center; }
/* 3. .rs__popular is position:absolute and painted straight through the
      business-type chips. The service shortcuts it offered are now served by
      "Browse by service" directly beneath, so it is redundant here. */
.hb-searchwrap .rs__popular{ display:none; }

/* registry-search.css caps .rs at a narrow max-width for the old centred hero;
   design D wants it spanning the container like Booking's. */
.hb-searchwrap .rs{ max-width:none; width:100%; margin:0; }

/* --- town tiles: legibility + the clipped counter ---------------------- */
/* The template's .listing-counter puts the number in a <span> that is absolutely
   positioned inside a badge sized for no number, so "4 verified members" rendered
   as "verified members" with the 4 sliced off. And the scrim was too weak for
   white type over pale treatment photography. */
.hb-towns .listing-item-grid{ height:250px; }
.hb-towns .listing-counter{
    position:absolute; left:16px; top:16px; right:auto; bottom:auto;
    display:inline-flex; align-items:baseline; gap:5px;
    padding:6px 12px; border-radius:999px; font-size:12.5px; font-weight:600;
    line-height:1.2; width:auto; height:auto; white-space:nowrap;
}
.hb-towns .listing-counter span{
    position:static; display:inline; width:auto; height:auto; margin:0; padding:0;
    background:none; font-weight:700; line-height:inherit; font-size:inherit; color:inherit;
}
.hb-towns .d-gr-sec{
    background:linear-gradient(rgba(15,13,12,.20) 0%,rgba(15,13,12,.30) 45%,rgba(15,13,12,.82) 100%) !important;
    opacity:1 !important;
}
.hb-towns .listing-item-grid_title h3 a{ color:#fff; text-shadow:0 1px 12px rgba(0,0,0,.5); }
.hb-towns .listing-item-grid_title p{ color:rgba(255,255,255,.92); text-shadow:0 1px 10px rgba(0,0,0,.5); }

/* --- favourites grid: equal-height cards ------------------------------- */
/* Grid children stretch, but the template's nested .listing-item / <article>
   do not inherit that, so a card with 3 treatment chips grew taller than one
   with 2 and the row looked broken. */
.hb-favs .gallery-item{ display:flex; }
.hb-favs .listing-item{ display:flex; flex-direction:column; width:100%; height:100%; }
.hb-favs .geodir-category-listing{ display:flex; flex-direction:column; width:100%; flex:1 1 auto; }
.hb-favs .geodir-category-opt{ flex:1 1 auto; display:flex; flex-direction:column; justify-content:space-between; }

/* ===================================================================
   Corrections from a side-by-side against mockups/d-home.html.
   Every one of these was invisible when looking at the live page alone.
   =================================================================== */

/* 1. HERO HEIGHT. I invented min-height:430px; the mockup has no such rule —
      its hero is sized by its own padding (~230px) and the search bar sits
      right under the copy. 430px left a huge dead expanse of video. */
section.hero-section.hb-hero{ min-height:0; }
.hb-hero__in{ padding-top:44px; padding-bottom:62px; }

/* 2. SEARCH BAR HEIGHT. registry-search.css prints an uppercase label above
      each input ("SERVICE OR BUSINESS"), which made the fields 67px tall against
      the mockup's ~44px and turned the coral frame into a heavy slab. Booking's
      pattern — and the mockup — is placeholder-only. */
.hb-searchwrap .rs__label{ display:none; }
.hb-searchwrap .rs__field{ padding:0 14px; min-height:46px; }
.hb-searchwrap .rs__input{ font-size:15px; }
.hb-searchwrap .rs__submit{ min-height:46px; }

/* 3. SECTION RHYTHM. The mockup runs tighter between blocks. */
.hb-sec{ padding:34px 0; }
.hb-sec--tight{ padding-top:6px; }

/* 4. CARD INTERNALS at 4-up. The treatment chips and the CTA were flexed side
      by side in a ~310px card, so the chips wrapped into a cramped 3-line column
      with the button floating beside them and dead space between. Stack them. */
.hb-favs .bt-card__row--foot{ flex-direction:column; align-items:stretch; gap:11px; }
.hb-favs .bt-card__tx{ width:100%; column-gap:12px; row-gap:7px; }
.hb-favs .bt-card__cta{ width:100%; }

/* 5. SEARCH BAR GEOMETRY, matched to the mockup by measurement.
      registry-search.css sets .rs__bar{min-height:68px} for the old tall hero
      bar; the mockup's is 54px. And the wrapper's -30px only closed the gap in
      flow rather than producing the 28px straddle the mockup has. */
.hb-searchwrap .rs__bar{ min-height:0; }
.hb-searchwrap .rs__field{ height:46px; min-height:0; }
/* .rs__bar is a grid with align-items:stretch, so the tallest cell sets the row
   height — the submit button was 62px and dragged the whole bar to 70px. */
.hb-searchwrap .rs__submit{ height:46px; min-height:0; padding:0 30px; }
/* -58px is where the bar lands flush with the hero's bottom edge (measured);
   the extra -28px reproduces the mockup's straddle. */
/* The wrapper's own box starts level with the header for reasons buried in the
   template's absolute positioning, so a negative margin on IT is unpredictable
   (-30px landed flush, -86px hid the bar behind the hero). Lift the BAR instead —
   it is the element the straddle is actually about, and it is deterministic. */
.hb-searchwrap{ margin-top:0; transform:translateY(-28px); margin-bottom:-14px; }

/* ===================================================================
   MEMBER CARDS — ported from mockups/cards.html (approved 2026-08-18)
   #02 split card  -> .hb-card  (homepage grid, category pages)
   #03 horizontal  -> .hb-row   (therapists.html, town.html)
   Markup is owned by tools/generate.py — never hand-edit card markup.
   Both read correctly with NO rating, because members.google_rating does
   not exist yet; rating_html() is the single switch.
   =================================================================== */
.hb-ico{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;
    stroke-linecap:round;stroke-linejoin:round}
.hb-star{width:14px;height:14px;flex:none;fill:none;stroke:#f5a623;stroke-width:1.7;stroke-linejoin:round}
.hb-rate{display:inline-flex;align-items:center;gap:5px;font-size:13.5px;font-weight:600;color:var(--ink)}
.hb-rate span{color:var(--hb-grey);font-weight:400}
.hb-vtick{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:#2f7d4f;font-weight:600}
.hb-vtick .hb-ico{width:13px;height:13px;stroke-width:2.6}
.hb-dot{display:inline-block;width:3px;height:3px;border-radius:50%;background:currentColor;
    vertical-align:middle;margin:0 7px;opacity:.5}
.hb-fab{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex:none;
    background:var(--hb-hdr);color:#fff;border:0;cursor:pointer;text-decoration:none;
    transition:transform .25s,background .25s}
.hb-fab:hover{transform:translateX(3px);background:var(--hb-pri);color:#fff}
.hb-fab .hb-ico{width:19px;height:19px}
.hb-save{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;
    display:grid;place-items:center;background:rgba(255,255,255,.92);color:var(--ink);pointer-events:none}

/* ---- #02 split card ---- */
.hb-card{background:#fff;border-radius:24px;padding:10px 10px 16px;height:100%;
    box-shadow:0 10px 30px -22px rgba(23,25,28,.4);transition:box-shadow .3s}
.hb-card:hover{box-shadow:0 16px 38px -22px rgba(23,25,28,.5)}
.hb-card__i{position:relative;border-radius:18px;overflow:hidden}
.hb-card__i img{width:100%;height:190px;object-fit:cover;display:block;transition:transform .6s}
.hb-card:hover .hb-card__i img{transform:scale(1.04)}
.hb-card__b{padding:14px 10px 0;position:relative}
.hb-card__n{font-size:19px;font-weight:700;letter-spacing:-.02em;margin:0 60px 3px 0;line-height:1.2}
.hb-card__n a{color:var(--ink)}
.hb-card:hover .hb-card__n a{color:var(--hb-pri)}
.hb-card__m{margin:0 60px 12px 0;color:var(--hb-grey);font-size:13.5px}
.hb-card__f{display:flex;align-items:center;gap:12px;flex-wrap:wrap;row-gap:6px;
    padding-right:52px;min-height:20px}
.hb-card .hb-fab{position:absolute;right:2px;bottom:-2px}

/* ---- #03 horizontal row ---- */
.hb-row{background:#fff;border-radius:24px;padding:10px;margin:0 0 14px;
    display:grid;grid-template-columns:150px 1fr auto;gap:16px;align-items:center;
    box-shadow:0 10px 30px -24px rgba(23,25,28,.4);transition:box-shadow .3s}
.hb-row:hover{box-shadow:0 16px 34px -24px rgba(23,25,28,.5)}
.hb-row__i{border-radius:18px;overflow:hidden}
.hb-row__i img{width:100%;height:132px;object-fit:cover;display:block}
.hb-row__b{min-width:0;padding:4px 0}
.hb-row__n{font-size:18px;font-weight:700;letter-spacing:-.02em;margin:0 0 3px;line-height:1.2}
.hb-row__n a{color:var(--ink)}
.hb-row:hover .hb-row__n a{color:var(--hb-pri)}
.hb-row__m{margin:0;color:var(--hb-grey);font-size:13.5px}
.hb-row__tx{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
.hb-row__tx span{border:1px solid var(--hb-line);border-radius:999px;padding:3px 9px;
    font-size:12px;color:var(--hb-grey)}
.hb-row__b .hb-vtick{margin-top:9px}
.hb-row__r{display:flex;flex-direction:column;align-items:flex-end;gap:10px;padding-right:6px}
.hb-row__p{text-align:right;line-height:1.2}
.hb-row__p b{display:block;font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.hb-row__p em{font-style:normal;font-size:12px;color:var(--hb-grey)}

/* grids that hold them */
.hb-favs{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.hb-favs .gallery-item{width:auto;padding:0;float:none}
.hb-favs .listing-item{width:auto;padding:0;float:none;height:100%}
.listing-item-container .listing-item{width:100%;padding:0;float:none}

@media (max-width:1100px){ .hb-favs{grid-template-columns:repeat(2,1fr)} }
@media (max-width:760px){
    .hb-favs{grid-template-columns:1fr;gap:14px}
    .hb-row{grid-template-columns:110px 1fr;gap:12px}
    .hb-row__i img{height:104px}
    .hb-row__r{grid-column:1/-1;flex-direction:row;justify-content:space-between;
        align-items:center;padding:2px 4px 4px}
    .hb-row__p{text-align:left}
}

/* The results container inherits text-align:center from the TownHub template,
   which centred the row card's name and meta while .hb-row__tx (a flex row)
   ignored it and stayed left — the two halves of the card pulled apart. */
.hb-row, .hb-card{ text-align:left; }
.hb-row__b, .hb-card__b{ text-align:left; }
.listing-item-container .listing-item{ margin:0; }

/* Isotope initialises on .gallery-items and sets inline position:absolute plus
   computed widths on every .gallery-item, and an inline height on the container.
   That is exactly what the old masonry grid needed and exactly what breaks a CSS
   grid — items left the flow and the cards rendered ~300px inside a 359px column.
   The homepage favourites grid is CSS grid now, so Isotope's inline styles are
   overridden here rather than the plugin being unpicked. */
.hb-favs{ height:auto !important; }
.hb-favs .gallery-item{
    position:static !important; left:auto !important; top:auto !important;
    width:auto !important; margin:0 !important; padding:0 !important; float:none !important;
}
.hb-favs .listing-item{ width:auto !important; padding:0 !important; float:none !important; }
.hb-favs .gallery-item > *{ width:100% !important; max-width:none !important; }

/* ==========================================================================
   RESULTS PAGES — design D filter rail + results column
   therapists.html and town.html. Markup is driven by js/hb-filters.js, which
   derives every option and count from the cards themselves.
   ========================================================================== */

/* The TownHub template puts text-align:center on the content wrapper, and it
   reaches everything here: the h1, the lead paragraph, every rail group
   heading and the example note. This is the same leak that once tore the row
   card in half, so the whole results surface is pinned left up front rather
   than patched per component as each one is noticed. */
.hb-rhead, .hb-rhead *, .hb-results, .hb-results *{ text-align:left; }
.hb-results .hb-sort__b, .hb-results .hb-none{ text-align:center; }
.hb-results .hb-none, .hb-results .hb-none *{ text-align:center; }
.hb-row__p, .hb-row__p *{ text-align:right; }

/* Page head. Replaces the template's parallax hero, which cost 380px of
   scroll before a visitor saw a single listing. */
.hb-rhead{ background:var(--hb-band); border-bottom:1px solid var(--hb-line);
    padding:26px 0 24px; }
.hb-rhead__in{ max-width:var(--hb-max); width:var(--hb-gut); margin:0 auto; }
.hb-rhead__crumb{ font-size:12.5px; color:var(--hb-grey); margin:0 0 8px; }
.hb-rhead__crumb a{ color:var(--hb-grey); }
.hb-rhead__crumb a:hover{ color:var(--hb-pri); }
.hb-rhead h1{ font-size:30px; font-weight:700; letter-spacing:-.025em;
    margin:0; line-height:1.15; color:var(--ink); }
.hb-rhead p{ margin:7px 0 0; color:var(--hb-grey); font-size:14.5px; max-width:62ch;
    line-height:1.5; }

/* The two-column body. 258px is wide enough for "Near public transport" on one
   line, which is the longest label the accessibility facet can produce. */
.hb-results{ max-width:var(--hb-max); width:var(--hb-gut); margin:0 auto;
    padding:26px 0 60px; display:grid; grid-template-columns:258px minmax(0,1fr);
    gap:30px; align-items:start; }

.hb-rail{ position:sticky; top:calc(var(--hb-hdr-h) + 14px); background:#fff;
    border:1px solid var(--hb-line); border-radius:14px; padding:6px 16px 14px; }
.hb-rail__head{ display:flex; align-items:center; gap:10px;
    padding:12px 0 10px; border-bottom:1px solid var(--hb-line); }
.hb-rail__head strong{ font-size:13px; font-weight:700; letter-spacing:.06em;
    text-transform:uppercase; color:var(--hb-grey); }
.hb-rail__clear{ margin-left:auto; border:0; background:none; cursor:pointer;
    font:600 12.5px/1 'General Sans',sans-serif; color:var(--hb-pri); padding:0; }
.hb-rail__clear:hover{ text-decoration:underline; }
.hb-rail__g{ padding:14px 0 4px; border-bottom:1px solid var(--hb-line); }
.hb-rail__g:last-child{ border-bottom:0; }
.hb-rail__g h4{ font-size:14px; font-weight:700; letter-spacing:-.01em;
    margin:0 0 9px; color:var(--ink); }
.hb-rail__o{ display:flex; align-items:center; gap:9px; cursor:pointer;
    padding:5px 0; font-size:13.5px; color:var(--ink); line-height:1.35; }
.hb-rail__o input{ width:16px; height:16px; flex:none; accent-color:var(--hb-pri);
    margin:0; cursor:pointer; }
.hb-rail__o span{ min-width:0; }
/* the count is a quiet fact, not a badge — it must never outweigh the label */
.hb-rail__o em{ margin-left:auto; font-style:normal; font-size:12.5px;
    color:var(--hb-grey); flex:none; }
.hb-rail__o.is-empty{ color:#a9a9a9; cursor:default; }
.hb-rail__o.is-empty em{ color:#bdbdbd; }
.hb-rail__o.is-empty input{ cursor:default; }

/* Results column */
.hb-rbar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap;
    margin:0 0 16px; }
.hb-rbar__n{ font-size:17px; font-weight:700; letter-spacing:-.02em; color:var(--ink); }
.hb-sort{ margin-left:auto; display:flex; gap:4px; background:var(--hb-band);
    border-radius:999px; padding:4px; }
.hb-sort__b{ border:0; background:none; cursor:pointer; border-radius:999px;
    padding:7px 14px; font:600 13px/1 'General Sans',sans-serif; color:var(--hb-grey); }
.hb-sort__b:hover{ color:var(--ink); }
.hb-sort__b.is-on{ background:#fff; color:var(--ink);
    box-shadow:0 1px 3px rgba(23,25,28,.13); }
.hb-none{ background:#fff; border:1px solid var(--hb-line); border-radius:14px;
    padding:44px 24px; color:var(--hb-grey); font-size:14.5px; }
/* the pre-launch caveat is a footnote to the count, not a banner across the
   column — it sat centred between the sort bar and the first card and read as
   a heading for the results */
.hb-results .bt-example-note{ margin:-8px 0 16px; font-size:12.5px; letter-spacing:.02em;
    text-transform:none; color:var(--hb-grey); }

/* Mobile: the rail becomes an off-canvas sheet. It cannot simply stack above
   the results — five filter groups would push the first listing off a phone
   screen entirely, which is the defect this whole page is meant to fix. */
.hb-railbtn{ display:none; }
.hb-railshade{ display:none; }
@media (max-width:1000px){
    .hb-results{ grid-template-columns:minmax(0,1fr); gap:0; padding-top:18px; }
    .hb-railbtn{ display:inline-flex; align-items:center; gap:8px; border:1px solid var(--hb-line);
        background:#fff; border-radius:999px; padding:9px 16px; cursor:pointer;
        font:600 13.5px/1 'General Sans',sans-serif; color:var(--ink); }
    .hb-railbtn svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.9; }
    .hb-rail{ position:fixed; z-index:60; top:0; bottom:0; left:0; width:min(320px,86vw);
        border-radius:0; border:0; border-right:1px solid var(--hb-line);
        overflow-y:auto; padding:14px 18px 40px;
        transform:translateX(-100%); transition:transform .22s ease; }
    .hb-rail-open .hb-rail{ transform:none; }
    /* No z-index on the sheet can lift it over the header. The template nests
       .content (z-index:4) inside #wrapper (z-index:25), and #wrapper is what
       gets compared against the header's z-index:40 in the #main stacking
       context — so the sheet painted UNDER the header and its own Filter /
       Clear all row was invisible. Raise the wrapper for as long as the sheet
       is open, and only then. */
    .hb-rail-open #wrapper{ z-index:50; }
    .hb-rail-open .hb-railshade{ display:block; position:fixed; inset:0; z-index:59;
        background:rgba(23,25,28,.45); }
    .hb-rail-open{ overflow:hidden; }
    .hb-sort{ margin-left:0; width:100%; justify-content:space-between; }
    .hb-sort__b{ flex:1; padding:8px 6px; }
    .hb-rhead{ padding:18px 0 16px; }
    .hb-rhead h1{ font-size:23px; }
}

/* The sheet's own exit controls. Desktop has no sheet, so neither exists there
   — the rail is just a column and a "Show 9 listings" button under it would be
   a button that does nothing. */
.hb-rail__x, .hb-rail__foot{ display:none; }
@media (max-width:1000px){
    .hb-rail__x{ display:block; margin-left:auto; border:0; background:none; cursor:pointer;
        font:400 26px/1 'General Sans',sans-serif; color:var(--hb-grey); padding:0 2px; }
    .hb-rail__clear + .hb-rail__x{ margin-left:14px; }
    /* full-bleed to the sheet's own padding so nothing scrolls through it */
    .hb-rail__foot{ display:block; position:sticky; bottom:0; margin:18px -18px 0;
        padding:12px 18px calc(12px + env(safe-area-inset-bottom));
        background:#fff; border-top:1px solid var(--hb-line); }
    .hb-rail__done{ display:block; width:100%; border:0; border-radius:7px;
        background:var(--hb-pri); color:#fff; cursor:pointer;
        padding:14px 18px; font:600 15px/1 'General Sans',sans-serif; }
    .hb-rail__done:hover{ background:var(--hb-pri-d); }
    /* the sheet's last group must clear the bar rather than sit behind it */
    .hb-rail{ padding-bottom:0; }
}

/* --- town.html: the rail inside the template's fixed panel ---------------
   town.html already HAS the fixed left panel (.hidden-search-column) and the
   template already wires .shsb_btn to reveal it on mobile. So here the rail is
   just the content of that panel: no card chrome of its own, no second
   off-canvas layer, no sticky. Fighting the viewport-locked layout is what
   broke Leaflet six times — see CLAUDE.md. */
/* Below 1000px the base .hb-rail turns into an off-canvas sheet — fixed, 320px
   wide, translateX(-100%). Overriding only `position` left the TRANSFORM in
   place, so on a phone the town rail sat at x=-290 and the panel showed a strip
   of right-aligned counts with every label off-screen. Undo the whole sheet
   treatment, not just its positioning. */
.hb-rail--town{ position:static; transform:none; transition:none;
    width:auto; overflow:visible; inset:auto;
    border:0; border-radius:0; padding:0 0 30px; background:transparent; }
.hb-rail--town .hb-rail__head{ display:none; }
.hb-rail--town .hb-rail__foot{ display:none; }
.hb-railttl{ font-size:15px; font-weight:700; letter-spacing:-.01em; margin:0; color:var(--ink); }
.hb-townttl{ font-size:22px; font-weight:700; letter-spacing:-.025em; margin:0 0 12px;
    color:var(--ink); }
.hb-townttl span{ color:var(--hb-pri); }
.hb-rbar--town{ margin-bottom:8px; }
/* The template's own Filters button. It is the ONLY way into the panel at any
   width — the panel is position:fixed under the list and clicking this adds
   .hidsb_act, which slides the list 380px right to reveal it. Hiding it on
   desktop (as a first pass did) leaves the rail built, correct and permanently
   unreachable. */
.hb-rbar--town .show-hidden-sb{ display:inline-flex; align-items:center; gap:8px;
    border:1px solid var(--hb-line); background:#fff; border-radius:999px;
    padding:9px 16px; cursor:pointer; font:600 13.5px/1 'General Sans',sans-serif;
    color:var(--ink); float:none; margin:0; text-shadow:none; }
.hb-rbar--town .show-hidden-sb:hover{ border-color:var(--ink); }
.hb-rbar--town .show-hidden-sb i{ color:var(--hb-pri); }

/* town.html inherits the same template text-align:center as therapists.html,
   and it reaches into the fixed panel too */
.hb-townhead, .hb-townhead *, .hb-rbar--town, .hb-rbar--town *,
.hidden-search-column, .hidden-search-column *{ text-align:left; }
/* the template's 25px/100px panel header offsets were sized for a two-tab
   widget; this is one line of text */
.hidden-search-column .filter-sidebar-header{ padding:22px 30px 0; margin-bottom:0; }
.hidden-search-column .scrl-content{ top:58px; right:0; }
.hb-rbar--town .hb-sort__b{ text-align:center; }
.hb-townhead{ padding:22px 0 4px; }
.hb-townhead .bt-example-note{ margin:8px 0 0; font-size:12.5px; text-transform:none;
    letter-spacing:.02em; color:var(--hb-grey); }
.hb-townhead .hb-none{ margin-top:14px; }
/* The bar is 64px of controls now, not a 155px title block — but ONLY above
   1071px, where it is position:fixed and the list has to clear it. Below that
   it is in normal flow, and this padding opened a dead grey band under the
   header. Same mistake as the .hidden-search-column offset above; same cure. */
@media (min-width:1071px){
    .col-list-wrap.anim_clw{ padding-top:66px; }
}
@media (max-width:1070px){
    .hb-rbar--town .hb-sort{ margin-left:0; width:100%; justify-content:space-between; }
    .hb-rbar--town .hb-sort__b{ flex:1; padding:8px 6px; }
    .hb-townttl{ font-size:20px; }
    /* the template already ships a Filters / View on map pair down here, and
       "View on map" is the more useful of the two on a phone where the map is
       off-screen — so the bar's own Filters button would just be a duplicate */
    .hb-rbar--town .show-hidden-sb{ display:none; }
}

/* ==========================================================================
   CATEGORY LANDING PAGES — design D, mockups/d-cat-hair.html
   Written by tools/categories.py. Every number on these pages is counted from
   the database; the mockup's "1,240 listings" was a placeholder.
   ========================================================================== */
.hb-cat-page, .hb-cat-page *{ text-align:left; }
.hb-cat-page .hb-btn, .hb-cat-page .hb-btn--ghost{ text-align:center; }

.hb-chero{ background:var(--hb-band); border-bottom:1px solid var(--hb-line);
    padding:52px 0 46px; }
.hb-chero__in, .hb-sec__in{ max-width:var(--hb-max); width:var(--hb-gut); margin:0 auto; }
.hb-chero h1{ font-size:44px; font-weight:700; letter-spacing:-.03em; line-height:1.08;
    margin:0; max-width:17ch; color:var(--ink); }
.hb-chero p{ margin:14px 0 0; font-size:16px; line-height:1.55; color:var(--hb-grey);
    max-width:56ch; }
.hb-chero__cta{ display:flex; gap:10px; flex-wrap:wrap; margin-top:24px !important; }

.hb-sec{ padding:44px 0 0; }
.hb-sec:last-child{ padding-bottom:64px; }
.hb-h2{ font-size:24px; font-weight:700; letter-spacing:-.025em; margin:0; color:var(--ink); }
.hb-sec__sub{ margin:7px 0 20px; color:var(--hb-grey); font-size:14.5px; line-height:1.5; }
.hb-sec__sub a{ color:var(--hb-pri); }
.hb-sec__more{ margin:20px 0 0; }

/* sub-category shelf */
.hb-cats{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.hb-cat{ display:block; border:1px solid var(--hb-line); border-radius:11px;
    padding:17px 18px 15px; background:#fff; }
.hb-cat:hover{ border-color:var(--ink); }
.hb-cat strong{ display:block; font-size:15.5px; font-weight:700; letter-spacing:-.015em;
    color:var(--ink); }
.hb-cat:hover strong{ color:var(--hb-pri); }
.hb-cat__b{ display:block; font-size:13px; color:var(--hb-grey); margin:4px 0 10px;
    line-height:1.4; }
.hb-cat__n{ display:block; font-size:12.5px; font-weight:600; color:var(--hb-pri); }
/* "No listings yet" is the honest state, and it must not shout like a count */
.hb-cat__n--none{ color:#a9a9a9; font-weight:400; }

/* town chips */
.hb-townchips{ display:flex; flex-wrap:wrap; gap:9px; }
.hb-townchip{ display:inline-flex; align-items:center; gap:9px; border:1px solid var(--hb-line);
    border-radius:999px; padding:9px 17px; font-size:14px; color:var(--ink); background:#fff; }
.hb-townchip:hover{ border-color:var(--ink); color:var(--hb-pri); }
.hb-townchip em{ font-style:normal; font-size:12.5px; color:var(--hb-grey); }

/* listing grid — the same split card the homepage uses */
.hb-favs--flat{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px;
    height:auto !important; }

/* guide call-out */
.hb-guidecall{ display:flex; align-items:center; gap:28px; background:var(--hb-band);
    border-radius:14px; padding:28px 30px; }
.hb-guidecall p{ margin:8px 0 0; color:var(--hb-grey); font-size:14.5px; line-height:1.55;
    max-width:70ch; }
.hb-guidecall .hb-btn{ flex:none; margin-left:auto; }

@media (max-width:1100px){
    .hb-cats{ grid-template-columns:repeat(2,minmax(0,1fr)); }
    .hb-favs--flat{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:700px){
    .hb-chero{ padding:34px 0 30px; }
    .hb-chero h1{ font-size:30px; max-width:none; }
    .hb-chero p{ font-size:15px; }
    .hb-chero__cta .hb-btn{ flex:1 1 100%; }
    .hb-cats{ grid-template-columns:1fr; }
    .hb-favs--flat{ grid-template-columns:1fr; }
    .hb-h2{ font-size:20px; }
    .hb-guidecall{ flex-direction:column; align-items:flex-start; gap:18px; padding:22px; }
    .hb-guidecall .hb-btn{ margin-left:0; width:100%; }
}

/* --- homepage: browse by area -------------------------------------------
   Eleven regions, written by tools/generate.py from lib/areas.js. They replace
   the six hardcoded town tiles: towns are a search now, not a page. A region
   with nothing in it is shown and dimmed rather than hidden — "we are not there
   yet" is information, and it is also where a new member lands the day they
   sign up. */
.hb-areas{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px;
    margin-top:18px; }
.hb-area{ display:block; color:var(--ink); border:1px solid var(--hb-line);
    border-radius:11px; overflow:hidden; background:#fff; }
.hb-area:hover{ border-color:var(--ink); }
.hb-area__img{ display:block; overflow:hidden; }
.hb-area__img img{ width:100%; height:112px; object-fit:cover; display:block;
    transition:transform .6s; }
.hb-area:hover .hb-area__img img{ transform:scale(1.04); }
.hb-area b{ display:block; font-size:15.5px; font-weight:700; letter-spacing:-.015em;
    margin:12px 15px 0; }
.hb-area:hover b{ color:var(--hb-pri); }
.hb-area__s{ display:block; font-size:12.5px; color:var(--hb-grey); margin:3px 15px 0;
    line-height:1.4; }
.hb-area__n{ display:block; font-size:12.5px; font-weight:600; color:var(--hb-pri);
    margin:6px 15px 14px; }
.hb-area__s:last-child{ margin-bottom:14px; }
/* an empty region is quiet, not absent */
.hb-area--empty{ background:var(--hb-band); }
.hb-area--empty .hb-area__img img{ filter:grayscale(1); opacity:.5; }
.hb-area--empty b{ color:var(--hb-grey); }
@media (max-width:1100px){ .hb-areas{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px){ .hb-areas{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } }

/* --- filter rail: radius search -----------------------------------------
   Distances are measured against the PUBLISHED pin, which for a home studio is
   an outcode centroid rather than their door — see the pin rule in CLAUDE.md.
   Honest to about a kilometre for those, exact for premises. */
.hb-near__row{ display:grid; grid-template-columns:1fr 76px auto; gap:6px; }
.hb-near__pc{ width:100%; min-width:0; border:1px solid var(--hb-line); border-radius:7px;
    padding:8px 10px; font:400 13.5px 'General Sans',sans-serif; color:var(--ink);
    background:#fff; -webkit-appearance:none; appearance:none; }
.hb-near__pc:focus{ outline:none; border-color:var(--hb-pri); }
.hb-near__mi{ border:1px solid var(--hb-line); border-radius:7px; background:#fff;
    font:400 13px 'General Sans',sans-serif; color:var(--ink); padding:8px 4px;
    min-width:0; }
.hb-near__go{ border:1px solid var(--hb-pri); background:var(--hb-pri); color:#fff;
    border-radius:7px; padding:8px 13px; cursor:pointer;
    font:600 13px/1 'General Sans',sans-serif; }
.hb-near__go:hover{ background:var(--hb-pri-d); border-color:var(--hb-pri-d); }
.hb-near__msg{ margin:8px 0 0; font-size:12.5px; color:var(--hb-grey); line-height:1.45; }
.hb-near__msg--err{ color:var(--hb-pri); }

/* the distance label is injected by js/hb-filters.js, so neither card renderer
   has to know about radius search */
.hb-dist{ display:inline-block; margin-top:6px; font-size:12.5px; font-weight:600;
    color:var(--hb-pri); }
.hb-row__b .hb-dist{ margin-top:4px; }

/* --- homepage: the county we are actually open in ------------------------
   Written by tools/generate.py, and ONLY when that county has published
   members. A launch band over an empty county would be the exact kind of claim
   this site does not make. */
.hb-feature{ display:block; position:relative; margin:18px 0 4px; padding:22px 26px;
    border-radius:13px; background:var(--hb-hdr); color:#fff; overflow:hidden; }
.hb-feature:hover{ color:#fff; }
.hb-feature__k{ display:inline-block; font-size:11px; font-weight:600; letter-spacing:.12em;
    text-transform:uppercase; color:var(--hb-acc); margin-bottom:9px; }
.hb-feature b{ display:block; font-size:23px; font-weight:700; letter-spacing:-.025em;
    line-height:1.2; color:#fff; max-width:26ch; }
.hb-feature__s{ display:block; margin-top:7px; font-size:14px; color:rgba(255,255,255,.72); }
.hb-feature__go{ display:inline-block; margin-top:16px; font-size:14px; font-weight:600;
    color:#fff; border-bottom:1px solid rgba(255,255,255,.45); padding-bottom:2px; }
.hb-feature:hover .hb-feature__go{ border-bottom-color:#fff; }
@media (max-width:700px){
    .hb-feature{ padding:20px; }
    .hb-feature b{ font-size:19px; }
}

/* ---- every hand-written page shipped with no <h1> at all -----------------
   The TownHub page-header block uses <h2>, so pricing, our-checks, privacy,
   terms, how-it-works, list-your-business, founding and 404 had no top-level
   heading — an SEO and screen-reader defect that no build step would catch.
   The tag is now <h1>; these rules carry the template's h2 styling across so
   the pages look identical. Mirrors .section-title h2 in style.css:1221. */
.section-title h1{ float:left; width:100%; text-align:center; color:var(--ink);
    font-size:34px; font-weight:800; position:relative; margin:0; }
.parallax-section .section-title h1{ font-size:32px; color:#fff; }
.bt-lead-hero .section-title h1{ color:var(--ink); }
@media only screen and (max-width:768px){ .section-title h1{ font-size:26px; } }

/* Google rating on a member's own profile. Stored and shown on cards since the
   Places work landed, but api/member-page.js never rendered it — see CLAUDE.md.
   Attribution is explicit and it is never used to order anything. */
.bt-profile-grate{ display:inline-flex; align-items:center; gap:6px; margin-left:12px;
    font-size:13px; font-weight:700; letter-spacing:-.01em; color:var(--ink);
    background:#fff; border:1px solid var(--line); border-radius:999px; padding:5px 12px; }
.bt-profile-grate svg{ width:13px; height:13px; fill:#f5b544; }
.bt-profile-grate span{ font-weight:500; color:var(--grey); }

/* Editorial breadcrumb must line up with the editorial column.
   .bt-guide is a centred 804px reading column, but .bt-crumbs-wrap used the
   full 1424px .container — so on all 57 guide, treatment and treatment x county
   pages the breadcrumb started at x=73 while the h1 it introduces started at
   x=405. Same width, same centring, so they share a left edge. */
.bt-crumbs-wrap .container{ max-width:804px; padding-left:22px; padding-right:22px; }

/* The 38px rhythm between guide blocks came from .bt-guide__block{margin:0 0 38px}
   — but .bt-list, .bt-faq and .bt-reg sections do not carry that class, so they
   had NO bottom margin and the next heading sat flush against them. "Red flags"
   had a 0px gap where every other section had 38.
   0,1,1 beats .bt-guide__block's 0,1,0 and sets the same value, so this is one
   rule for every block rather than a class list that has to be kept in step. */
.bt-guide > section{ margin-bottom:38px; }
.bt-guide > section:last-child{ margin-bottom:0; }

/* ---- how-it-works: the template's process timeline -----------------------
   .process-wrap li is float:left;width:33.3% and .process-item is auto-height,
   so a card whose copy wraps to three lines is taller than its neighbours — and
   because .process-count is pinned bottom:-25px on each CARD, the 01/02/03
   badges came out at three different heights. On top of that .pr-dec draws a
   connector rule across the row at an arbitrary top:50%, and .process-end
   leaves a tick circle dangling on a vertical line under the LAST card only.
   Flex gives the cards equal height so the badges line up; the connector and
   the terminal marker are decoration this design uses nowhere else. */
.process-wrap ul{ display:flex; flex-wrap:wrap; align-items:stretch; }
.process-wrap li{ float:none; display:flex; }
.process-wrap .process-item{ float:none; width:100%; display:flex;
    flex-direction:column; }
.process-wrap .process-item p{ margin-bottom:0; }
.pr-dec, .process-end{ display:none !important; }
@media only screen and (max-width:768px){
  .process-wrap li{ width:100%; padding:0 0 34px; }
}

/* 404: was the TownHub demo page — a parallax hero pointing at
   images/bg/hero/1.jpg (the "YOUR IMAGE 1920X1024" placeholder), a dead
   <form action="#">, and the title "Directory Listing Template". */
/* clear:both because .section-title's children are float:left in the template
   — without it the form sat BESIDE the heading and ran off the right edge. */
.bt-404__form{ display:flex; clear:both; gap:10px; max-width:520px;
    margin:0 auto 22px; }
.bt-404__form input{ flex:1; padding:13px 16px; border:1px solid var(--line);
    border-radius:999px; font:400 15px 'General Sans',sans-serif; background:#fff; }
.bt-404__form input:focus{ outline:none; border-color:var(--blush); }
.bt-404__links{ text-align:center; color:var(--grey); font-size:14px; }
.bt-404__links a{ color:var(--blush); }
@media only screen and (max-width:600px){ .bt-404__form{ flex-direction:column; } }

/* The verified tick sits directly against the location span in the editorial
   member strips — "&#10003;Headingley" with no gap. */
.bt-mini-tick{ margin-right:5px; }

/* ---- compiled listings ---------------------------------------------------
   A page we built for a business that never asked us to. It must never be
   mistakable for a checked one — the whole product is the gap between "we
   verified this" and "we did not", and a compiled page that looks verified
   collapses it. Amber, not blush: this is a caveat, not a brand moment. */
.bt-profile-vbadge--compiled{ background:#fdf3e3; color:#8a5a12; border-color:#f0dcb4; }
.bt-compiled{ border-left:3px solid #e0a93c; background:#fdf9f1; }
.bt-compiled .bt-unverified__lead{ color:#8a5a12; }
.bt-compiled a{ color:var(--blush); text-decoration:underline; }