/* ============================================================
   BARE Midlands — shared styles for inner pages
   Used by the treatment pages, the FAQ and the legal pages.
   ============================================================ */

@font-face{font-family:'Archivo';font-style:normal;font-weight:300;src:url('fonts/archivo-v25-latin-300.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;src:url('fonts/archivo-v25-latin-regular.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;src:url('fonts/archivo-v25-latin-500.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;src:url('fonts/archivo-v25-latin-600.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Archivo';font-style:normal;font-weight:800;src:url('fonts/archivo-v25-latin-800.woff2') format('woff2');font-display:swap}

:root{
  --sand:#D6C9B9;
  --ink:#0D0D0C;
  --deep:#101112;
  --copper:#8C745E;
  --bone:#EDE7DE;
  --mid:#B59D88;
  --ease:cubic-bezier(.16,.84,.28,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:'Archivo',-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--sand);color:var(--ink);
  font-weight:300;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit}
::selection{background:var(--copper);color:var(--bone)}
:focus-visible{outline:2px solid var(--copper);outline-offset:4px}

/* ---------- nav ---------- */
nav{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding:18px clamp(20px,5vw,60px);
  background:var(--sand);border-bottom:1px solid rgba(13,13,12,.12);
}
nav .n-mark{display:block;width:92px}
nav .n-mark img{width:100%;height:auto}
nav .n-links{display:flex;gap:clamp(12px,2.4vw,28px);align-items:center}
nav a{text-decoration:none;font-size:.78rem;font-weight:500;letter-spacing:.06em}
nav a:hover{text-decoration:underline}
.n-cta{
  border:1px solid var(--ink);border-radius:999px;padding:9px 18px;
  text-decoration:none !important;
}
.n-cta:hover{background:var(--ink);color:var(--sand)}
@media(max-width:720px){ nav .n-links a:not(.n-cta){display:none} }

/* ---------- mobile menu ---------- */
.burger{
  display:none;width:42px;height:42px;padding:0;margin-left:12px;
  background:none;border:0;cursor:pointer;color:inherit;
  flex-direction:column;justify-content:center;align-items:flex-end;gap:6px;
}
.burger span{
  display:block;width:24px;height:1.5px;background:currentColor;
  transition:transform .3s var(--ease);
}
body.nav-open .burger span:first-child{transform:translateY(3.75px) rotate(45deg)}
body.nav-open .burger span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
@media(max-width:720px){ .burger{display:flex} }

.menu{
  position:fixed;inset:0;z-index:60;background:var(--ink);
  display:flex;flex-direction:column;justify-content:center;
  padding:0 clamp(24px,8vw,48px);
  opacity:0;transition:opacity .35s var(--ease);
}
.menu[hidden]{display:none}
body.nav-open .menu{opacity:1}
.menu a{
  color:var(--bone);text-decoration:none;
  font-weight:800;letter-spacing:-.03em;line-height:1.25;
  font-size:clamp(1.5rem,7vw,2.1rem);
  padding:9px 0;border-bottom:1px solid rgba(237,231,222,.12);
}
.menu a:last-child{border-bottom:0;color:var(--mid)}
body.nav-open{overflow:hidden}

/* ---------- hero ---------- */
.top{
  position:relative;background:var(--deep);color:var(--bone);
  min-height:52svh;display:flex;align-items:flex-end;overflow:hidden;
}
.top img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;
}
.top .top-in{
  position:relative;z-index:2;width:100%;
  max-width:1100px;margin:0 auto;
  padding:clamp(70px,14vh,140px) clamp(20px,5vw,60px) clamp(34px,6vh,60px);
}
.tag{
  display:block;font-size:.68rem;font-weight:600;letter-spacing:.26em;
  text-transform:uppercase;color:var(--mid);margin-bottom:16px;
}
h1{
  font-weight:800;letter-spacing:-.04em;line-height:.96;
  font-size:clamp(2.2rem,6vw,4.2rem);max-width:18ch;
}
.top p{margin-top:20px;max-width:52ch;color:rgba(237,231,222,.8)}

/* ---------- body ---------- */
main{max-width:72ch;margin:0 auto;padding:clamp(44px,8vw,90px) clamp(20px,5vw,60px)}
h2{
  font-weight:800;letter-spacing:-.03em;line-height:1.05;
  font-size:clamp(1.5rem,3.6vw,2.2rem);margin-top:56px;margin-bottom:16px;
}
h2:first-of-type{margin-top:0}
h3{font-weight:600;font-size:1.05rem;margin-top:30px;margin-bottom:6px}
p{margin-bottom:16px}
ul{margin:0 0 18px 20px}
li{margin-bottom:8px}
strong{font-weight:600}

.lead{font-size:clamp(1.05rem,2vw,1.22rem);line-height:1.6;margin-bottom:30px}

.note{
  border-left:2px solid var(--copper);padding:2px 0 2px 18px;
  margin:26px 0;font-size:.95rem;color:rgba(13,13,12,.75);
}
.tbc{color:var(--copper)}

/* ---------- call to action ---------- */
.cta{
  background:var(--ink);color:var(--bone);
  padding:clamp(40px,7vw,70px) clamp(20px,5vw,60px);
}
.cta-in{max-width:72ch;margin:0 auto}
.cta h2{margin:0 0 14px;color:var(--bone)}
.cta p{color:rgba(237,231,222,.75);max-width:52ch}
.btn{
  display:inline-block;margin-top:24px;text-decoration:none;
  font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:15px 30px;border-radius:999px;
  background:var(--bone);color:var(--ink);border:1px solid var(--bone);
  transition:background .25s var(--ease),color .25s var(--ease);
}
.btn:hover{background:transparent;color:var(--bone)}

/* ---------- other treatments ---------- */
.more{padding:clamp(40px,7vw,70px) clamp(20px,5vw,60px);border-top:1px solid rgba(13,13,12,.12)}
.more-in{max-width:1100px;margin:0 auto}
.more h2{font-size:1.1rem;font-weight:600;letter-spacing:0;margin:0 0 20px}
.more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:760px){ .more-grid{grid-template-columns:1fr} }
.more-grid a{
  display:block;text-decoration:none;padding:20px;
  border:1px solid rgba(13,13,12,.18);border-radius:2px;
  font-weight:600;font-size:1rem;transition:background .2s,border-color .2s;
}
.more-grid a:hover{background:rgba(13,13,12,.05);border-color:var(--ink)}
.more-grid span{display:block;font-weight:300;font-size:.88rem;color:rgba(13,13,12,.65);margin-top:4px}

/* ---------- footer ---------- */
footer{
  background:var(--deep);color:rgba(237,231,222,.6);
  padding:clamp(44px,7vw,70px) clamp(20px,5vw,60px) 40px;
  font-size:.86rem;
}
.f-in{max-width:1100px;margin:0 auto;display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.f-mark{width:170px}
.f-meta{display:grid;gap:6px}
.f-meta a{text-decoration:none;border-bottom:1px solid rgba(237,231,222,.25)}
.f-base{
  max-width:1100px;margin:40px auto 0;padding-top:20px;
  border-top:1px solid rgba(237,231,222,.12);
  display:flex;justify-content:space-between;gap:10px 28px;flex-wrap:wrap;
  font-size:.74rem;line-height:1.6;color:rgba(237,231,222,.4);
}
.f-base span:first-child{flex:1 1 400px;max-width:60ch}
.f-base a{text-decoration:none;border-bottom:1px solid rgba(237,231,222,.25)}