/* Liquid Beauty landing pages. Brand tokens taken from liquidbeauty.com (navy #13254b / #061c47, gold #c6a46c, Forum display). */
:root{
  --paper:#f8f5f0;--surface:#fffdfa;--sand:#efe8e1;
  --ink:#13254b;--text:#2c3346;--muted:#5a5f70;
  --navy:#13254b;--navy-deep:#061c47;
  --gold:#c6a46c;--gold-ink:#7d5f27;
  --line:#e2d9cf;
  --on-navy:#dfe3ec;--on-navy-muted:#c3c9d8;
  --display:"Forum",Georgia,"Times New Roman",serif;
  --body:"Figtree","Helvetica Neue",Helvetica,sans-serif;
  --r:4px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
p{margin:0}
h1,h2,h3{text-wrap:balance;font-weight:400;color:var(--ink);margin:0}
.wrap{max-width:1160px;margin:0 auto;padding-inline:16px}
@media (min-width:700px){.wrap{padding-inline:28px}}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
[id]{scroll-margin-top:84px}

/* header */
.bar{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.bar .wrap{display:flex;align-items:center;gap:12px 24px;padding-block:12px}
.bar .logo{height:34px;width:auto;margin-right:auto}
.bar .tel{color:var(--ink);font-weight:700;text-decoration:none;font-size:15px;white-space:nowrap;line-height:1.3}
.bar .tel small{display:block;font-size:11px;font-weight:500;color:var(--muted);letter-spacing:.04em}

/* buttons: one radius vocabulary (4px), no pills */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--navy);color:#fff;font-weight:600;font-size:15px;padding:14px 24px;border-radius:var(--r);text-decoration:none;border:0;cursor:pointer;font-family:var(--body);letter-spacing:.02em;text-align:center;white-space:nowrap;transition:background-color .15s ease}
.btn:hover{background:var(--navy-deep)}
.btn.sm{padding:10px 16px;font-size:14px}
.btn.gold{background:var(--gold);color:var(--navy-deep)}
.btn.gold:hover{background:#d8b97f}
.btn.line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn.line:hover{background:#e7eaf1}
.btn svg{width:16px;height:16px;flex:none}

footer{background:var(--sand);color:var(--muted);font-size:14px;border-top:1px solid var(--line)}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 32px;padding-block:30px;align-items:center}
footer .logo{height:28px;width:auto}
footer a{color:var(--ink);text-decoration:none;font-weight:700}
footer .legal{flex-basis:100%;border-top:1px solid #d9cbb9;padding-top:14px;display:flex;flex-wrap:wrap;gap:6px 20px;font-size:12px}
footer .legal a{font-weight:500;text-decoration:underline}

.mbar{display:none}
@media (max-width:880px){
  .bar .btn{display:none}
  .bar .logo{height:28px}
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:9;background:var(--surface);border-top:1px solid var(--line);padding:10px 16px;gap:10px}
  .mbar a{flex:1;padding:12px 8px;font-size:14px}
  body.has-mbar{padding-bottom:70px}
}
@media (max-width:420px){.bar .tel small{display:none}}
