/* =========================================================
   CURIOUS CRAFTERS — PROFESSIONAL TEMPLATE FINISH v1.0.4
   Clean header/footer system + polished Joomla module output.
   Loaded after UTP frontend contracts.
   ========================================================= */

body.cc-site{
  margin:0;
  background:var(--cc-bg,#fbf6f1) !important;
  color:var(--cc-text,#5a2817) !important;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body.cc-site #cc-page{
  width:100%;
  min-height:100vh;
  overflow-x:hidden;
}

/* =========================================================
   HEADER — professional app bar
   ========================================================= */
body.cc-site #t4-header.cc-header{
  position:sticky;
  top:0;
  z-index:10020;
  width:100%;
  min-height:82px;
  padding:0 clamp(22px,3vw,42px);
  background:
    linear-gradient(180deg,rgba(255,252,248,.985),rgba(249,240,232,.965)) !important;
  border-bottom:1px solid rgba(111,58,30,.14);
  box-shadow:0 10px 30px rgba(62,34,20,.08);
  backdrop-filter:saturate(125%) blur(8px);
}

body.cc-site #t4-header .t4-row{
  width:min(100%,var(--cc-max,1280px));
  min-height:82px;
  margin:0 auto;
  display:grid !important;
  grid-template-columns:minmax(210px,270px) minmax(0,1fr) minmax(230px,310px);
  align-items:center !important;
  gap:clamp(18px,2.2vw,34px) !important;
}

/* Logo / brand */
body.cc-site #t4-header .t4-col.logo,
body.cc-site #t4-header .cc-header-logo{
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  overflow:visible !important;
}

body.cc-site #t4-header .navbar-brand.logo,
body.cc-site #t4-header .logo,
body.cc-site #t4-header .cc-header-logo a{
  display:inline-flex !important;
  align-items:center !important;
  gap:12px !important;
  width:auto !important;
  max-width:100% !important;
  min-height:58px !important;
  padding:0 !important;
  margin:0 !important;
  color:var(--cc-heading,#4d2215) !important;
  text-decoration:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

body.cc-site #t4-header .logo-img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:220px !important;
  max-height:72px !important;
  object-fit:contain !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
}

body.cc-site #t4-header .logo-img-sm{
  display:none !important;
}

body.cc-site .cc-brand-text{
  display:inline-flex;
  align-items:center;
  min-height:58px;
  color:var(--cc-heading,#4d2215);
  font-weight:900;
  font-size:clamp(1.35rem,2.1vw,1.85rem);
  line-height:1;
  letter-spacing:-.045em;
  white-space:nowrap;
}

/* Main nav */
body.cc-site #t4-header .t4-col.mainnav,
body.cc-site #t4-header .cc-header-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:0 !important;
  width:auto !important;
  max-width:none !important;
  overflow:visible !important;
  padding:0 !important;
}

body.cc-site #t4-header ul,
body.cc-site #t4-header li{
  list-style:none !important;
}

body.cc-site #t4-header ul{
  margin:0 !important;
  padding:0 !important;
}

body.cc-site #t4-header .mod-menu,
body.cc-site #t4-header .menu,
body.cc-site #t4-header .nav,
body.cc-site #t4-header .navbar-nav,
body.cc-site #t4-header .navbar-nav.level0,
body.cc-site #t4-header .nav.navbar-nav.level0{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:nowrap !important;
  gap:clamp(4px,.55vw,9px) !important;
  width:auto !important;
  max-width:100% !important;
  overflow:visible !important;
}

body.cc-site #t4-header .mod-menu > li,
body.cc-site #t4-header .menu > li,
body.cc-site #t4-header .nav > li,
body.cc-site #t4-header .navbar-nav > li{
  display:flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
}

body.cc-site #t4-header .mod-menu > li > a,
body.cc-site #t4-header .menu > li > a,
body.cc-site #t4-header .nav > li > a,
body.cc-site #t4-header .navbar-nav > li > a,
body.cc-site #t4-header .nav-link{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:42px !important;
  padding:0 clamp(8px,.8vw,13px) !important;
  border-radius:999px !important;
  color:#5d2c1a !important;
  background:transparent !important;
  border:1px solid transparent !important;
  font-size:clamp(.78rem,.78vw,.94rem) !important;
  font-weight:800 !important;
  line-height:1.1 !important;
  letter-spacing:.01em !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  box-shadow:none !important;
  transform:none !important;
}

body.cc-site #t4-header .mod-menu > li > a:hover,
body.cc-site #t4-header .menu > li > a:hover,
body.cc-site #t4-header .nav > li > a:hover,
body.cc-site #t4-header .navbar-nav > li > a:hover,
body.cc-site #t4-header .nav-link:hover,
body.cc-site #t4-header .mod-menu > li.current > a,
body.cc-site #t4-header .mod-menu > li.active > a,
body.cc-site #t4-header .menu > li.current > a,
body.cc-site #t4-header .menu > li.active > a,
body.cc-site #t4-header .nav > li.current > a,
body.cc-site #t4-header .nav > li.active > a{
  color:#9f4f2f !important;
  background:rgba(184,99,63,.09) !important;
  border-color:rgba(184,99,63,.15) !important;
}

/* Search */
body.cc-site #t4-header .t4-col.search,
body.cc-site #t4-header .cc-header-search{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  min-width:0 !important;
  width:auto !important;
  max-width:none !important;
  overflow:visible !important;
}

body.cc-site #t4-header search,
body.cc-site #t4-header .mod-finder,
body.cc-site #t4-header .finder,
body.cc-site #t4-header .finder-search{
  width:100% !important;
  max-width:300px !important;
  margin:0 !important;
  padding:0 !important;
}

body.cc-site #t4-header .mod-finder form,
body.cc-site #t4-header .finder form,
body.cc-site #t4-header .finder-search form{
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.cc-site #t4-header input[type="search"],
body.cc-site #t4-header input[type="text"]{
  width:100% !important;
  min-height:42px !important;
  padding:0 15px !important;
  border:1px solid rgba(111,58,30,.16) !important;
  border-radius:999px !important;
  background:#fffdf9 !important;
  color:#4d2215 !important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.025),0 1px 0 rgba(255,255,255,.7) !important;
  font-size:.94rem !important;
}

/* =========================================================
   HERO / SECTION LAYER
   ========================================================= */
body.cc-site .cc-hero,
body.cc-site .cc-section{
  width:100vw !important;
  max-width:none !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  box-sizing:border-box !important;
}

body.cc-site .cc-hero-inner,
body.cc-site .cc-section-inner{
  width:min(var(--cc-max,1280px),calc(100% - 40px)) !important;
  max-width:var(--cc-max,1280px) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Main content polish */
body.cc-site .cc-component .cc-section-inner{
  padding-top:clamp(12px,2vw,22px);
  padding-bottom:clamp(8px,1.5vw,18px);
}

body.cc-site .page-header,
body.cc-site .category-desc,
body.cc-site .com-content-category-blog > h1,
body.cc-site .componentheading{
  border-radius:16px;
}

/* =========================================================
   CARD MEDIA + CARD POLISH
   ========================================================= */
body.cc-site .cc-card,
body.cc-site .cc-feature-card,
body.cc-site .cc-page-card,
body.cc-site .cc-listing,
body.cc-site .category-desc,
body.cc-site .page-header{
  border-radius:18px !important;
  border:1px solid rgba(111,58,30,.11) !important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(252,248,244,.98)) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.7) inset,
    0 18px 36px rgba(58,34,24,.10),
    0 4px 10px rgba(0,0,0,.045) !important;
}

body.cc-site .cc-card-media{
  position:relative;
  display:block;
  width:calc(100% + 44px);
  margin:-24px -22px 18px;
  aspect-ratio:16/9;
  overflow:hidden;
  background:linear-gradient(180deg,#f6f1ea 0%,#efe3d7 100%);
  border-bottom:1px solid rgba(111,58,30,.12);
}

body.cc-site .cc-card-media img{
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  object-position:center center;
  display:block;
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
}

body.cc-site .cc-card .cc-card-media + h3,
body.cc-site .cc-feature-card .cc-card-media + h3{
  margin-top:0;
}

/* Header/footer/card images must not inherit article image frame. */
body.cc-site #t4-header img,
body.cc-site #t4-footnav img,
body.cc-site .cc-page-card-image img,
body.cc-site .cc-listing-favicon img,
body.cc-site .cc-card-media img{
  margin:0 !important;
}

/* =========================================================
   FOOTER — professional copper footer
   ========================================================= */
body.cc-site #t4-footnav.cc-footer{
  position:relative;
  width:100%;
  margin-top:0 !important;
  padding:clamp(42px,5vw,64px) clamp(22px,3vw,42px) !important;
  background:
    radial-gradient(circle at 15% 10%,rgba(229,177,145,.24),transparent 24%),
    linear-gradient(180deg,#7d5038 0%,#5d3a2a 58%,#43281e 100%) !important;
  color:#f9eadf !important;
  border-top:1px solid rgba(255,245,236,.18) !important;
  box-shadow:0 -18px 48px rgba(58,34,24,.10);
}

body.cc-site #t4-footnav::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,229,205,.48),transparent);
}

body.cc-site #t4-footnav .cc-section-inner{
  width:min(var(--cc-max,1280px),calc(100% - 40px)) !important;
  max-width:var(--cc-max,1280px) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:clamp(20px,3vw,36px);
  align-items:start;
}

body.cc-site #t4-footnav .module,
body.cc-site #t4-footnav .moduletable,
body.cc-site #t4-footnav .t4-module{
  margin:0 !important;
}

body.cc-site #t4-footnav .module-title,
body.cc-site #t4-footnav .block-title,
body.cc-site #t4-footnav h3,
body.cc-site #t4-footnav h4{
  margin:0 0 14px !important;
  color:#fff6ed !important;
  font-size:1.02rem !important;
  font-weight:900 !important;
  letter-spacing:.02em !important;
  text-transform:none !important;
}

body.cc-site #t4-footnav,
body.cc-site #t4-footnav p,
body.cc-site #t4-footnav li,
body.cc-site #t4-footnav span{
  color:#f6dfd0 !important;
}

body.cc-site #t4-footnav ul,
body.cc-site #t4-footnav .nav,
body.cc-site #t4-footnav .menu,
body.cc-site #t4-footnav .mod-menu{
  display:grid !important;
  gap:7px !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

body.cc-site #t4-footnav a,
body.cc-site #t4-footnav .nav-link,
body.cc-site #t4-footnav .nav a,
body.cc-site #t4-footnav .menu a,
body.cc-site #t4-footnav .mod-menu a{
  display:inline-flex !important;
  width:max-content !important;
  max-width:100% !important;
  min-height:0 !important;
  padding:0 !important;
  color:#ffe1cd !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  font-size:.98rem !important;
  font-weight:650 !important;
  line-height:1.55 !important;
  text-decoration:none !important;
  transform:none !important;
}

body.cc-site #t4-footnav a:hover,
body.cc-site #t4-footnav a:focus{
  color:#ffffff !important;
  text-decoration:underline !important;
  text-underline-offset:4px;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1180px){
  body.cc-site #t4-header .t4-row{
    grid-template-columns:minmax(170px,230px) minmax(0,1fr) minmax(185px,240px);
    gap:14px !important;
  }

  body.cc-site #t4-header .logo-img{
    max-width:190px !important;
    max-height:66px !important;
  }

  body.cc-site #t4-header .mod-menu > li > a,
  body.cc-site #t4-header .menu > li > a,
  body.cc-site #t4-header .nav > li > a,
  body.cc-site #t4-header .navbar-nav > li > a,
  body.cc-site #t4-header .nav-link{
    padding:0 7px !important;
    font-size:.76rem !important;
  }
}

@media (max-width:991.98px){
  body.cc-site #t4-header.cc-header{
    position:relative;
    min-height:auto;
    padding:14px 18px;
  }

  body.cc-site #t4-header .t4-row{
    width:100%;
    min-height:auto;
    display:grid !important;
    grid-template-columns:1fr;
    gap:12px !important;
    justify-items:center;
  }

  body.cc-site #t4-header .t4-col.logo,
  body.cc-site #t4-header .cc-header-logo,
  body.cc-site #t4-header .t4-col.mainnav,
  body.cc-site #t4-header .cc-header-nav,
  body.cc-site #t4-header .t4-col.search,
  body.cc-site #t4-header .cc-header-search{
    width:100% !important;
    justify-content:center !important;
  }

  body.cc-site #t4-header .logo-img{
    max-width:min(240px,72vw) !important;
    max-height:76px !important;
  }

  body.cc-site #t4-header .mod-menu,
  body.cc-site #t4-header .menu,
  body.cc-site #t4-header .nav,
  body.cc-site #t4-header .navbar-nav{
    flex-wrap:wrap !important;
    row-gap:6px !important;
  }

  body.cc-site #t4-header search,
  body.cc-site #t4-header .mod-finder,
  body.cc-site #t4-header .finder,
  body.cc-site #t4-header .finder-search{
    max-width:min(100%,420px) !important;
  }
}

@media (max-width:767px){
  body.cc-site .cc-hero,
  body.cc-site .cc-section{
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  body.cc-site .cc-hero-inner,
  body.cc-site .cc-section-inner{
    width:min(100%,calc(100% - 24px)) !important;
  }

  body.cc-site .cc-card-media{
    width:calc(100% + 36px);
    margin:-20px -18px 16px;
  }

  body.cc-site #t4-footnav .cc-section-inner{
    grid-template-columns:1fr !important;
    width:min(100%,calc(100% - 24px)) !important;
  }
}


/* =========================================================
   CURIOUS CRAFTERS — HEADER MENU/SEARCH FIX v1.0.5
   ========================================================= */

/* Joomla/Finder can output a label that becomes visibly rendered above the search box.
   Hide it visually in the header only while keeping it available to screen readers. */
body.cc-site #t4-header .cc-header-search label,
body.cc-site #t4-header .cc-header-search label.finder,
body.cc-site #t4-header .cc-header-search .finder label,
body.cc-site #t4-header .cc-header-search .visually-hidden,
body.cc-site #t4-header .cc-header-search .sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* Make the header menu behave as one row even when promoted from a body position. */
body.cc-site #t4-header .cc-header-nav > ul,
body.cc-site #t4-header .cc-header-nav > .mod-menu,
body.cc-site #t4-header .cc-header-nav > .menu,
body.cc-site #t4-header .cc-header-nav > .nav{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Prevent duplicated-looking menu fragments from wrapping into a second visual line. */
body.cc-site #t4-header .cc-header-nav{
  max-height:64px !important;
}


/* =========================================================
   CURIOUS CRAFTERS — RESPONSIVE HEADER AUTHORITY v1.0.6
   Fixes menu/search collision on wide-but-constrained viewports.
   ========================================================= */

/* Large desktop: true 3-column header, but with safer menu/search sizing. */
@media (min-width: 1281px){
  body.cc-site #t4-header .t4-row{
    grid-template-columns:minmax(180px,240px) minmax(0,1fr) minmax(220px,320px) !important;
    gap:clamp(16px,2vw,32px) !important;
  }

  body.cc-site #t4-header .cc-header-nav{
    min-width:0 !important;
    overflow:hidden !important;
  }

  body.cc-site #t4-header .cc-header-search{
    min-width:220px !important;
    justify-self:end !important;
  }

  body.cc-site #t4-header search,
  body.cc-site #t4-header .mod-finder,
  body.cc-site #t4-header .finder,
  body.cc-site #t4-header .finder-search{
    max-width:min(320px,20vw) !important;
  }
}

/* Intermediate desktop / split-screen: put menu on its own row.
   This prevents the nav from competing with the search box. */
@media (min-width: 992px) and (max-width: 1280px){
  body.cc-site #t4-header.cc-header{
    padding-top:8px !important;
    padding-bottom:9px !important;
  }

  body.cc-site #t4-header .t4-row{
    display:grid !important;
    grid-template-columns:minmax(150px,230px) minmax(220px,1fr) !important;
    grid-template-areas:
      "logo search"
      "menu menu" !important;
    align-items:center !important;
    row-gap:7px !important;
    column-gap:18px !important;
    min-height:auto !important;
  }

  body.cc-site #t4-header .cc-header-logo{
    grid-area:logo !important;
    justify-self:start !important;
  }

  body.cc-site #t4-header .cc-header-nav{
    grid-area:menu !important;
    width:100% !important;
    max-width:100% !important;
    justify-content:center !important;
    overflow:visible !important;
  }

  body.cc-site #t4-header .cc-header-search{
    grid-area:search !important;
    justify-self:end !important;
    width:min(100%,340px) !important;
    max-width:340px !important;
  }

  body.cc-site #t4-header .logo-img{
    max-width:185px !important;
    max-height:58px !important;
  }

  body.cc-site #t4-header .mod-menu,
  body.cc-site #t4-header .menu,
  body.cc-site #t4-header .nav,
  body.cc-site #t4-header .navbar-nav,
  body.cc-site #t4-header .navbar-nav.level0,
  body.cc-site #t4-header .nav.navbar-nav.level0{
    width:100% !important;
    max-width:100% !important;
    flex-wrap:wrap !important;
    justify-content:center !important;
    row-gap:5px !important;
    column-gap:5px !important;
  }

  body.cc-site #t4-header .mod-menu > li > a,
  body.cc-site #t4-header .menu > li > a,
  body.cc-site #t4-header .nav > li > a,
  body.cc-site #t4-header .navbar-nav > li > a,
  body.cc-site #t4-header .nav-link{
    min-height:34px !important;
    padding:0 10px !important;
    font-size:.78rem !important;
  }

  body.cc-site #t4-header search,
  body.cc-site #t4-header .mod-finder,
  body.cc-site #t4-header .finder,
  body.cc-site #t4-header .finder-search{
    max-width:340px !important;
  }

  body.cc-site #t4-header input[type="search"],
  body.cc-site #t4-header input[type="text"]{
    min-height:38px !important;
    font-size:.88rem !important;
  }
}

/* Narrow desktop/tablet boundary: stack cleanly before menu/search can collide. */
@media (max-width: 991.98px){
  body.cc-site #t4-header .t4-row{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "logo"
      "menu"
      "search" !important;
  }

  body.cc-site #t4-header .cc-header-logo{grid-area:logo !important;}
  body.cc-site #t4-header .cc-header-nav{grid-area:menu !important;}
  body.cc-site #t4-header .cc-header-search{grid-area:search !important;}

  body.cc-site #t4-header .cc-header-search{
    width:min(100%,420px) !important;
    max-width:420px !important;
    justify-self:center !important;
  }
}

/* Do not allow the search form to visually sit on top of the menu. */
body.cc-site #t4-header .cc-header-nav{
  position:relative !important;
  z-index:2 !important;
}

body.cc-site #t4-header .cc-header-search{
  position:relative !important;
  z-index:1 !important;
}

/* Remove older max-height clamp from v1.0.5 that could crop wrapped menus. */
body.cc-site #t4-header .cc-header-nav{
  max-height:none !important;
}


/* =========================================================
   CURIOUS CRAFTERS — RESPONSIVE HEADER AUTHORITY v1.0.6
   Fixes menu/search collision on wide-but-constrained viewports.
   ========================================================= */

/* Large desktop: true 3-column header, but with safer menu/search sizing. */
@media (min-width: 1281px){
  body.cc-site #t4-header .t4-row{
    grid-template-columns:minmax(180px,240px) minmax(0,1fr) minmax(220px,320px) !important;
    gap:clamp(16px,2vw,32px) !important;
  }

  body.cc-site #t4-header .cc-header-nav{
    min-width:0 !important;
    overflow:hidden !important;
  }

  body.cc-site #t4-header .cc-header-search{
    min-width:220px !important;
    justify-self:end !important;
  }

  body.cc-site #t4-header search,
  body.cc-site #t4-header .mod-finder,
  body.cc-site #t4-header .finder,
  body.cc-site #t4-header .finder-search{
    max-width:min(320px,20vw) !important;
  }
}

/* Intermediate desktop / split-screen: put menu on its own row.
   This prevents the nav from competing with the search box. */
@media (min-width: 992px) and (max-width: 1280px){
  body.cc-site #t4-header.cc-header{
    padding-top:8px !important;
    padding-bottom:9px !important;
  }

  body.cc-site #t4-header .t4-row{
    display:grid !important;
    grid-template-columns:minmax(150px,230px) minmax(220px,1fr) !important;
    grid-template-areas:
      "logo search"
      "menu menu" !important;
    align-items:center !important;
    row-gap:7px !important;
    column-gap:18px !important;
    min-height:auto !important;
  }

  body.cc-site #t4-header .cc-header-logo{
    grid-area:logo !important;
    justify-self:start !important;
  }

  body.cc-site #t4-header .cc-header-nav{
    grid-area:menu !important;
    width:100% !important;
    max-width:100% !important;
    justify-content:center !important;
    overflow:visible !important;
  }

  body.cc-site #t4-header .cc-header-search{
    grid-area:search !important;
    justify-self:end !important;
    width:min(100%,340px) !important;
    max-width:340px !important;
  }

  body.cc-site #t4-header .logo-img{
    max-width:185px !important;
    max-height:58px !important;
  }

  body.cc-site #t4-header .mod-menu,
  body.cc-site #t4-header .menu,
  body.cc-site #t4-header .nav,
  body.cc-site #t4-header .navbar-nav,
  body.cc-site #t4-header .navbar-nav.level0,
  body.cc-site #t4-header .nav.navbar-nav.level0{
    width:100% !important;
    max-width:100% !important;
    flex-wrap:wrap !important;
    justify-content:center !important;
    row-gap:5px !important;
    column-gap:5px !important;
  }

  body.cc-site #t4-header .mod-menu > li > a,
  body.cc-site #t4-header .menu > li > a,
  body.cc-site #t4-header .nav > li > a,
  body.cc-site #t4-header .navbar-nav > li > a,
  body.cc-site #t4-header .nav-link{
    min-height:34px !important;
    padding:0 10px !important;
    font-size:.78rem !important;
  }

  body.cc-site #t4-header search,
  body.cc-site #t4-header .mod-finder,
  body.cc-site #t4-header .finder,
  body.cc-site #t4-header .finder-search{
    max-width:340px !important;
  }

  body.cc-site #t4-header input[type="search"],
  body.cc-site #t4-header input[type="text"]{
    min-height:38px !important;
    font-size:.88rem !important;
  }
}

/* Narrow desktop/tablet boundary: stack cleanly before menu/search can collide. */
@media (max-width: 991.98px){
  body.cc-site #t4-header .t4-row{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "logo"
      "menu"
      "search" !important;
  }

  body.cc-site #t4-header .cc-header-logo{grid-area:logo !important;}
  body.cc-site #t4-header .cc-header-nav{grid-area:menu !important;}
  body.cc-site #t4-header .cc-header-search{grid-area:search !important;}

  body.cc-site #t4-header .cc-header-search{
    width:min(100%,420px) !important;
    max-width:420px !important;
    justify-self:center !important;
  }
}

/* Do not allow the search form to visually sit on top of the menu. */
body.cc-site #t4-header .cc-header-nav{
  position:relative !important;
  z-index:2 !important;
}

body.cc-site #t4-header .cc-header-search{
  position:relative !important;
  z-index:1 !important;
}

/* Remove older max-height clamp from v1.0.5 that could crop wrapped menus. */
body.cc-site #t4-header .cc-header-nav{
  max-height:none !important;
}


/* =========================================================
   CURIOUS CRAFTERS — HARD PAGINATION NORMALIZER v1.0.8
   Root fix for directory output that renders pagination as an unclassed
   vertical bullet list inside nested component markup.
   ========================================================= */

/* Classed Joomla pagination. */
body.cc-site main .pagination,
body.cc-site main ul.pagination,
body.cc-site main ol.pagination,
body.cc-site main .pagination-list,
body.cc-site main ul.pagination-list,
body.cc-site main ol.pagination-list,
body.cc-site main .pages,
body.cc-site main ul.pages,
body.cc-site main ol.pages,
body.cc-site main nav[aria-label*="Pagination" i] ul,
body.cc-site main nav[aria-label*="pagination" i] ul,
body.cc-site main nav.pagination ul{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  width:100% !important;
  max-width:100% !important;
  margin:clamp(22px,3vw,34px) auto !important;
  padding:0 !important;
  list-style:none !important;
  list-style-type:none !important;
  background:transparent !important;
  border:0 !important;
}

/* Unclassed pagination lists generated by directory/blog components.
   These are intentionally scoped to component/main content and require
   real pagination links, so ordinary content bullets are not affected. */
body.cc-site main ul:has(> li > a[href*="limitstart"]),
body.cc-site main ul:has(> li > a[href*="start="]),
body.cc-site main ul:has(> li > a[href*="limit="]),
body.cc-site main ul:has(> li > a[title*="Page" i]),
body.cc-site main ul:has(> li > a[aria-label*="Page" i]),
body.cc-site main ol:has(> li > a[href*="limitstart"]),
body.cc-site main ol:has(> li > a[href*="start="]),
body.cc-site main ol:has(> li > a[href*="limit="]),
body.cc-site main ol:has(> li > a[title*="Page" i]),
body.cc-site main ol:has(> li > a[aria-label*="Page" i]){
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  width:100% !important;
  max-width:100% !important;
  margin:clamp(22px,3vw,34px) auto !important;
  padding:0 !important;
  list-style:none !important;
  list-style-type:none !important;
  background:transparent !important;
  border:0 !important;
}

/* Kill bullets on the pagination list items. */
body.cc-site main .pagination > li,
body.cc-site main .pagination-list > li,
body.cc-site main .pages > li,
body.cc-site main nav[aria-label*="Pagination" i] li,
body.cc-site main nav[aria-label*="pagination" i] li,
body.cc-site main ul:has(> li > a[href*="limitstart"]) > li,
body.cc-site main ul:has(> li > a[href*="start="]) > li,
body.cc-site main ul:has(> li > a[href*="limit="]) > li,
body.cc-site main ul:has(> li > a[title*="Page" i]) > li,
body.cc-site main ul:has(> li > a[aria-label*="Page" i]) > li,
body.cc-site main ol:has(> li > a[href*="limitstart"]) > li,
body.cc-site main ol:has(> li > a[href*="start="]) > li,
body.cc-site main ol:has(> li > a[href*="limit="]) > li,
body.cc-site main ol:has(> li > a[title*="Page" i]) > li,
body.cc-site main ol:has(> li > a[aria-label*="Page" i]) > li{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
  list-style-type:none !important;
  background:transparent !important;
  border:0 !important;
}

body.cc-site main .pagination > li::marker,
body.cc-site main .pagination-list > li::marker,
body.cc-site main .pages > li::marker,
body.cc-site main ul:has(> li > a[href*="limitstart"]) > li::marker,
body.cc-site main ul:has(> li > a[href*="start="]) > li::marker,
body.cc-site main ul:has(> li > a[href*="limit="]) > li::marker,
body.cc-site main ul:has(> li > a[title*="Page" i]) > li::marker,
body.cc-site main ul:has(> li > a[aria-label*="Page" i]) > li::marker,
body.cc-site main ol:has(> li > a[href*="limitstart"]) > li::marker,
body.cc-site main ol:has(> li > a[href*="start="]) > li::marker,
body.cc-site main ol:has(> li > a[href*="limit="]) > li::marker,
body.cc-site main ol:has(> li > a[title*="Page" i]) > li::marker,
body.cc-site main ol:has(> li > a[aria-label*="Page" i]) > li::marker{
  content:"" !important;
}

/* Turn pagination links/spans into compact buttons. */
body.cc-site main .pagination a,
body.cc-site main .pagination span,
body.cc-site main .pagination-list a,
body.cc-site main .pagination-list span,
body.cc-site main .pages a,
body.cc-site main .pages span,
body.cc-site main nav[aria-label*="Pagination" i] a,
body.cc-site main nav[aria-label*="pagination" i] a,
body.cc-site main ul:has(> li > a[href*="limitstart"]) > li > a,
body.cc-site main ul:has(> li > a[href*="start="]) > li > a,
body.cc-site main ul:has(> li > a[href*="limit="]) > li > a,
body.cc-site main ul:has(> li > a[title*="Page" i]) > li > a,
body.cc-site main ul:has(> li > a[aria-label*="Page" i]) > li > a,
body.cc-site main ol:has(> li > a[href*="limitstart"]) > li > a,
body.cc-site main ol:has(> li > a[href*="start="]) > li > a,
body.cc-site main ol:has(> li > a[href*="limit="]) > li > a,
body.cc-site main ol:has(> li > a[title*="Page" i]) > li > a,
body.cc-site main ol:has(> li > a[aria-label*="Page" i]) > li > a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:36px !important;
  min-height:36px !important;
  padding:0 12px !important;
  border:1px solid rgba(111,58,30,.16) !important;
  border-radius:999px !important;
  background:#fffdf9 !important;
  color:#6b351f !important;
  box-shadow:0 8px 18px rgba(70,40,26,.06) !important;
  font-size:.88rem !important;
  font-weight:800 !important;
  line-height:1 !important;
  text-align:center !important;
  text-decoration:none !important;
}

body.cc-site main .pagination a:hover,
body.cc-site main .pagination-list a:hover,
body.cc-site main .pages a:hover,
body.cc-site main nav[aria-label*="Pagination" i] a:hover,
body.cc-site main nav[aria-label*="pagination" i] a:hover,
body.cc-site main ul:has(> li > a[href*="limitstart"]) > li > a:hover,
body.cc-site main ul:has(> li > a[href*="start="]) > li > a:hover,
body.cc-site main ul:has(> li > a[href*="limit="]) > li > a:hover,
body.cc-site main ul:has(> li > a[title*="Page" i]) > li > a:hover,
body.cc-site main ul:has(> li > a[aria-label*="Page" i]) > li > a:hover{
  background:#b8643c !important;
  border-color:#b8643c !important;
  color:#fff !important;
}

/* Current page sometimes renders as a span or disabled/current class. */
body.cc-site main .pagination .active > a,
body.cc-site main .pagination .active > span,
body.cc-site main .pagination .current > a,
body.cc-site main .pagination .current > span,
body.cc-site main .pagination-list .active > a,
body.cc-site main .pagination-list .active > span,
body.cc-site main .pages .active > a,
body.cc-site main .pages .active > span{
  background:#7d3d23 !important;
  border-color:#7d3d23 !important;
  color:#fff !important;
}

body.cc-site main .counter,
body.cc-site main .pagination-counter,
body.cc-site main .page-counter,
body.cc-site main p.counter{
  display:block !important;
  width:100% !important;
  margin:10px auto 0 !important;
  color:#8b6b5a !important;
  text-align:center !important;
  font-size:.86rem !important;
  font-weight:700 !important;
}

/* If the extension emits orphan bullet-only separators around the page list,
   collapse empty list items. */
body.cc-site main li:empty{
  display:none !important;
}


/* =========================================================
   CURIOUS CRAFTERS — HERO POSITION + EMPTY SPACE REMOVAL v1.0.9
   ========================================================= */

/* The hero module is now the real hero row directly under the header. */
body.cc-site #hero.cc-template-hero-modules{
  display:block !important;
  width:100vw !important;
  max-width:none !important;
  margin:0 0 0 calc(50% - 50vw) !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
}

body.cc-site #hero.cc-template-hero-modules > .cc-hero-inner{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}

/* The custom module already contains .cc-hero. Do not add a second padded hero shell around it. */
body.cc-site #hero.cc-template-hero-modules .moduletable,
body.cc-site #hero.cc-template-hero-modules .module,
body.cc-site #hero.cc-template-hero-modules .mod-custom,
body.cc-site #hero.cc-template-hero-modules .custom{
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  width:100% !important;
  max-width:none !important;
}

/* Hero section should terminate cleanly. */
body.cc-site #hero .cc-hero,
body.cc-site #hero .cc-hero-image{
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/* Remove the empty beige component band that was caused by rendering an empty
   frontpage component between the hero module and the homepage modules. */
body.cc-site .cc-main{
  padding-top:0 !important;
  margin-top:0 !important;
}

body.cc-site .cc-main > .cc-section:first-child{
  margin-top:0 !important;
}

/* CSS fallback for older installs or non-home routes that emit an empty blog component. */
body.cc-site .cc-component:has(.blog-featured:empty),
body.cc-site .cc-component:has(> .cc-section-inner > .blog-featured:empty),
body.cc-site .cc-component:has(> .cc-section-inner:empty),
body.cc-site .cc-section:has(> .cc-section-inner > .blog-featured:empty){
  display:none !important;
  margin:0 !important;
  padding:0 !important;
  min-height:0 !important;
  height:0 !important;
}

/* Pull the first real homepage module closer to the hero. */
body.cc-site #hero + .cc-main .cc-section:first-of-type{
  padding-top:clamp(28px,3.4vw,46px) !important;
}

@media (max-width:767px){
  body.cc-site #hero.cc-template-hero-modules{
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  body.cc-site #hero + .cc-main .cc-section:first-of-type{
    padding-top:24px !important;
  }
}


/* =========================================================
   CURIOUS CRAFTERS — MOBILE HEADER + HERO HIERARCHY REPAIR v1.0.10
   Fixes the mobile screenshot state:
   - compact logo/header spacing
   - places search and Menu in one clean control row
   - prevents giant stacked whitespace above hero
   - reduces mobile hero headline dominance
   - improves secondary CTA contrast
   - suppresses empty hero kicker/pill artifacts
   ========================================================= */
@media (max-width: 767.98px){
  body.cc-site #t4-header.cc-header{
    position:relative !important;
    min-height:0 !important;
    padding:10px 16px 12px !important;
    background:linear-gradient(180deg,#fffaf5,#fbf1e8) !important;
    border-bottom:1px solid rgba(111,58,30,.12) !important;
    box-shadow:0 8px 22px rgba(62,34,20,.06) !important;
  }

  body.cc-site #t4-header .t4-row,
  body.cc-site #t4-header .cc-header-row{
    width:100% !important;
    min-height:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "logo logo"
      "search menu" !important;
    align-items:center !important;
    justify-items:stretch !important;
    gap:10px 10px !important;
    margin:0 !important;
  }

  body.cc-site #t4-header .cc-header-logo,
  body.cc-site #t4-header .t4-col.logo{
    grid-area:logo !important;
    width:100% !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    min-height:58px !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.cc-site #t4-header .logo-img,
  body.cc-site #t4-header .custom-logo img,
  body.cc-site #t4-header .site-logo img,
  body.cc-site #t4-header .navbar-brand img{
    display:block !important;
    width:auto !important;
    max-width:min(170px,48vw) !important;
    max-height:58px !important;
    margin:0 auto !important;
    object-fit:contain !important;
  }

  body.cc-site #t4-header .cc-header-search,
  body.cc-site #t4-header .t4-col.search{
    grid-area:search !important;
    display:flex !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    justify-self:stretch !important;
    justify-content:stretch !important;
    align-items:center !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.cc-site #t4-header search,
  body.cc-site #t4-header .mod-finder,
  body.cc-site #t4-header .finder,
  body.cc-site #t4-header .finder-search,
  body.cc-site #t4-header form.mod-finder,
  body.cc-site #t4-header form.finder,
  body.cc-site #t4-header form.form-search{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.cc-site #t4-header .mod-finder form,
  body.cc-site #t4-header .finder form,
  body.cc-site #t4-header .finder-search form{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  body.cc-site #t4-header input[type="search"],
  body.cc-site #t4-header input[type="text"]{
    width:100% !important;
    min-height:46px !important;
    height:46px !important;
    padding:0 16px !important;
    border-radius:999px !important;
    border:1px solid rgba(111,58,30,.16) !important;
    background:#fffdf9 !important;
    color:#5a2817 !important;
    font-size:1rem !important;
    box-shadow:inset 0 1px 2px rgba(0,0,0,.025) !important;
  }

  body.cc-site #t4-header .cc-header-nav,
  body.cc-site #t4-header .t4-col.mainnav{
    grid-area:menu !important;
    display:flex !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    justify-self:end !important;
    justify-content:flex-end !important;
    align-items:center !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* Desktop nav lists remain hidden on phone; the visible control is the mobile/offcanvas/Menu trigger. */
  body.cc-site #t4-header .cc-header-nav > ul,
  body.cc-site #t4-header .cc-header-nav .mod-menu,
  body.cc-site #t4-header .cc-header-nav .menu,
  body.cc-site #t4-header .cc-header-nav .nav,
  body.cc-site #t4-header .cc-header-nav .navbar-nav{
    display:none !important;
  }

  body.cc-site #t4-header .navbar-toggler,
  body.cc-site #t4-header .t4-offcanvas-toggle,
  body.cc-site #t4-header .js-offcanvas-trigger,
  body.cc-site #t4-header button[class*="menu"],
  body.cc-site #t4-header .cc-header-nav button,
  body.cc-site #t4-header .cc-header-nav [role="button"]{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:86px !important;
    width:auto !important;
    height:46px !important;
    min-height:46px !important;
    padding:0 15px !important;
    margin:0 !important;
    border-radius:14px !important;
    border:1px solid rgba(255,255,255,.22) !important;
    background:#152034 !important;
    color:#fff !important;
    box-shadow:0 8px 20px rgba(30,23,19,.12) !important;
    font-size:.95rem !important;
    font-weight:850 !important;
    line-height:1 !important;
  }

  body.cc-site #hero.cc-template-hero-modules,
  body.cc-site #hero.cc-template-hero-built-in{
    margin-top:0 !important;
  }

  body.cc-site .cc-hero,
  body.cc-site .cc-hero-image{
    min-height:0 !important;
    padding:clamp(44px,11vw,76px) 0 clamp(44px,10vw,70px) !important;
  }

  body.cc-site .cc-hero-inner{
    width:min(100%,calc(100% - 28px)) !important;
    min-height:0 !important;
  }

  body.cc-site .cc-hero-content{
    max-width:100% !important;
    padding:0 !important;
  }

  body.cc-site .cc-hero-kicker:empty,
  body.cc-site .cc-hero-kicker[aria-hidden="true"],
  body.cc-site .cc-hero-kicker:not(:has(*)):not(:has(text)){
    display:none !important;
  }

  body.cc-site .cc-hero h1{
    max-width:11.5ch !important;
    margin:0 auto 18px !important;
    font-size:clamp(2.25rem,10.4vw,3.55rem) !important;
    line-height:1.05 !important;
    letter-spacing:-.055em !important;
    text-wrap:balance !important;
  }

  body.cc-site .cc-hero p{
    max-width:31ch !important;
    margin:0 auto !important;
    font-size:1rem !important;
    line-height:1.55 !important;
  }

  body.cc-site .cc-hero-actions{
    width:min(100%, 350px) !important;
    margin:26px auto 0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    align-items:stretch !important;
  }

  body.cc-site .cc-hero-actions a,
  body.cc-site .cc-hero-actions .cc-btn,
  body.cc-site .cc-btn{
    width:100% !important;
    min-height:54px !important;
    border-radius:14px !important;
    font-size:1rem !important;
    font-weight:900 !important;
  }

  body.cc-site .cc-hero-actions a:not(.cc-btn-primary):not(.btn-primary),
  body.cc-site .cc-hero-actions .cc-btn-secondary{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:rgba(255,250,245,.94) !important;
    color:#6b2f1c !important;
    border:1px solid rgba(111,58,30,.18) !important;
    box-shadow:0 8px 20px rgba(62,34,20,.08) !important;
    text-shadow:none !important;
  }
}


/* =========================================================
   CURIOUS CRAFTERS — MOBILE HEADER/HERO HIERARCHY REPAIR v1.0.11
   Target: actual screenshot problem.
   - Header becomes compact and intentional.
   - Search and Menu share one row instead of stacking.
   - Logo is smaller and no longer floats in a tall blank band.
   - Hero headline is scaled for mobile.
   - Secondary hero action becomes readable.
   ========================================================= */

@media (max-width: 767.98px){

  html,
  body.cc-site{
    overflow-x:hidden !important;
  }

  body.cc-site #t4-header.cc-header{
    position:relative !important;
    min-height:0 !important;
    padding:10px 16px 12px !important;
    background:linear-gradient(180deg,#fffaf5 0%,#f8eee6 100%) !important;
    border-bottom:1px solid rgba(111,58,30,.12) !important;
    box-shadow:0 5px 16px rgba(62,34,20,.055) !important;
  }

  body.cc-site #t4-header .t4-row,
  body.cc-site #t4-header .cc-header-row{
    width:100% !important;
    max-width:100% !important;
    min-height:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "logo logo"
      "search menu" !important;
    column-gap:10px !important;
    row-gap:10px !important;
    align-items:center !important;
    justify-items:stretch !important;
    margin:0 auto !important;
    padding:0 !important;
  }

  body.cc-site #t4-header .cc-header-logo,
  body.cc-site #t4-header .t4-col.logo{
    grid-area:logo !important;
    width:100% !important;
    min-height:46px !important;
    height:46px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.cc-site #t4-header .navbar-brand.logo,
  body.cc-site #t4-header .logo,
  body.cc-site #t4-header .cc-header-logo a{
    min-height:46px !important;
    height:46px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.cc-site #t4-header .logo-img,
  body.cc-site #t4-header .custom-logo img,
  body.cc-site #t4-header .site-logo img,
  body.cc-site #t4-header .navbar-brand img{
    display:block !important;
    width:auto !important;
    max-width:118px !important;
    max-height:42px !important;
    height:auto !important;
    margin:0 auto !important;
    object-fit:contain !important;
  }

  body.cc-site #t4-header .cc-header-search,
  body.cc-site #t4-header .t4-col.search{
    grid-area:search !important;
    display:flex !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    justify-self:stretch !important;
    align-items:center !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.cc-site #t4-header search,
  body.cc-site #t4-header .mod-finder,
  body.cc-site #t4-header .finder,
  body.cc-site #t4-header .finder-search,
  body.cc-site #t4-header form.mod-finder,
  body.cc-site #t4-header form.finder,
  body.cc-site #t4-header form.form-search{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.cc-site #t4-header .mod-finder form,
  body.cc-site #t4-header .finder form,
  body.cc-site #t4-header .finder-search form{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  body.cc-site #t4-header .input-group,
  body.cc-site #t4-header .finder,
  body.cc-site #t4-header .mod-finder__search{
    width:100% !important;
    display:flex !important;
    align-items:center !important;
  }

  body.cc-site #t4-header input[type="search"],
  body.cc-site #t4-header input[type="text"]{
    width:100% !important;
    min-width:0 !important;
    height:44px !important;
    min-height:44px !important;
    padding:0 15px !important;
    border-radius:999px !important;
    border:1px solid rgba(111,58,30,.14) !important;
    background:#fffdf9 !important;
    color:#5a2817 !important;
    font-size:1rem !important;
    font-weight:700 !important;
    box-shadow:inset 0 1px 2px rgba(0,0,0,.02),0 1px 0 rgba(255,255,255,.7) !important;
  }

  body.cc-site #t4-header .cc-header-nav,
  body.cc-site #t4-header .t4-col.mainnav{
    grid-area:menu !important;
    display:flex !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    justify-self:end !important;
    align-items:center !important;
    justify-content:flex-end !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* Hide desktop nav lists on phone; keep only the actual menu/offcanvas/toggle button. */
  body.cc-site #t4-header .cc-header-nav > ul,
  body.cc-site #t4-header .cc-header-nav .mod-menu,
  body.cc-site #t4-header .cc-header-nav .menu,
  body.cc-site #t4-header .cc-header-nav .nav,
  body.cc-site #t4-header .cc-header-nav .navbar-nav{
    display:none !important;
  }

  body.cc-site #t4-header .navbar-toggler,
  body.cc-site #t4-header .t4-offcanvas-toggle,
  body.cc-site #t4-header .js-offcanvas-trigger,
  body.cc-site #t4-header button[class*="menu"],
  body.cc-site #t4-header .cc-header-nav button,
  body.cc-site #t4-header .cc-header-nav [role="button"]{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    min-width:112px !important;
    height:44px !important;
    min-height:44px !important;
    padding:0 16px !important;
    margin:0 !important;
    border-radius:14px !important;
    border:1px solid rgba(255,255,255,.22) !important;
    background:#152034 !important;
    color:#fff !important;
    box-shadow:0 7px 16px rgba(30,23,19,.12) !important;
    font-size:1rem !important;
    font-weight:900 !important;
    line-height:1 !important;
  }

  body.cc-site #hero.cc-template-hero-modules,
  body.cc-site #hero.cc-template-hero-built-in{
    margin-top:0 !important;
    padding-top:0 !important;
  }

  body.cc-site .cc-hero,
  body.cc-site .cc-hero-image{
    min-height:0 !important;
    padding:48px 0 46px !important;
    background-position:center center !important;
  }

  body.cc-site .cc-hero::before,
  body.cc-site .cc-hero-image::before{
    background:rgba(38,22,15,.26) !important;
  }

  body.cc-site .cc-hero-inner{
    width:min(100%,calc(100% - 28px)) !important;
    min-height:0 !important;
    margin:0 auto !important;
  }

  body.cc-site .cc-hero-content{
    max-width:100% !important;
    padding:0 !important;
  }

  body.cc-site .cc-hero-kicker:empty,
  body.cc-site .cc-hero-kicker[aria-hidden="true"]{
    display:none !important;
  }

  body.cc-site .cc-hero h1{
    max-width:10.75ch !important;
    margin:0 auto 20px !important;
    font-size:clamp(2.02rem,8.55vw,3.05rem) !important;
    line-height:1.06 !important;
    letter-spacing:-.055em !important;
    text-align:center !important;
    text-wrap:balance !important;
  }

  body.cc-site .cc-hero p{
    max-width:31ch !important;
    margin:0 auto !important;
    font-size:.98rem !important;
    line-height:1.55 !important;
  }

  body.cc-site .cc-hero-actions{
    width:min(100%, 350px) !important;
    margin:24px auto 0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:13px !important;
    align-items:stretch !important;
  }

  body.cc-site .cc-hero-actions a,
  body.cc-site .cc-hero-actions .cc-btn,
  body.cc-site .cc-btn{
    width:100% !important;
    min-height:54px !important;
    border-radius:15px !important;
    font-size:1rem !important;
    font-weight:950 !important;
    text-align:center !important;
  }

  body.cc-site .cc-hero-actions a:not(.cc-btn-primary):not(.btn-primary),
  body.cc-site .cc-hero-actions .cc-btn-secondary{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:rgba(255,250,245,.96) !important;
    color:#6b2f1c !important;
    border:1px solid rgba(111,58,30,.18) !important;
    box-shadow:0 8px 20px rgba(62,34,20,.10) !important;
    text-shadow:none !important;
  }
}

@media (max-width: 390px){
  body.cc-site #t4-header.cc-header{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  body.cc-site #t4-header .t4-row,
  body.cc-site #t4-header .cc-header-row{
    column-gap:8px !important;
  }

  body.cc-site #t4-header .navbar-toggler,
  body.cc-site #t4-header .t4-offcanvas-toggle,
  body.cc-site #t4-header .js-offcanvas-trigger,
  body.cc-site #t4-header button[class*="menu"],
  body.cc-site #t4-header .cc-header-nav button,
  body.cc-site #t4-header .cc-header-nav [role="button"]{
    min-width:96px !important;
    padding:0 13px !important;
  }

  body.cc-site .cc-hero h1{
    font-size:clamp(1.9rem,8.35vw,2.75rem) !important;
  }
}