:root{
  --bg:#FBFBF9;
  --ink:#101010;
  --accent:#9A3412;
  --hair:rgba(16,16,16,.16);
  --mute:rgba(16,16,16,.58);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Manrope",Arial,sans-serif;
  font-weight:300;
  font-size:16px;
  line-height:1.6;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
}
h1,h2{font-weight:300;margin:0;letter-spacing:-.015em}
p{margin:0}
a{color:inherit;text-decoration:none}

.wrap{
  max-width:1180px;
  margin:0 auto;
  padding:0 clamp(22px,7vw,120px);
}

/* ---------- top bar ---------- */
.bar{
  position:fixed;
  top:0;left:0;right:0;
  z-index:50;
  background:rgba(251,251,249,.92);
  backdrop-filter:saturate(1.1) blur(8px);
  border-bottom:1px solid var(--hair);
}
.bar__in{
  max-width:1180px;
  margin:0 auto;
  padding:0 clamp(22px,7vw,120px);
  height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.wordmark{
  font-size:15px;
  letter-spacing:.26em;
  text-transform:uppercase;
  font-weight:300;
  display:inline-flex;
  align-items:baseline;
  gap:5px;
  white-space:nowrap;
}
.wordmark .dot{
  width:4px;height:4px;
  background:var(--ink);
  display:inline-block;
  transform:translateY(-1px);
}
.bar__nav{display:flex;gap:clamp(12px,3vw,34px)}
.bar__nav a{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--mute);
  padding-bottom:2px;
  border-bottom:1px solid transparent;
  transition:color .25s ease,border-color .25s ease;
}
.bar__nav a:hover,.bar__nav a.is-active{color:var(--ink);border-bottom-color:var(--hair)}

/* ---------- shared grid ---------- */
.grid{
  display:grid;
  grid-template-columns:minmax(120px,2fr) minmax(0,7fr);
  gap:clamp(26px,5vw,80px);
  align-items:start;
}
.label{
  font-size:10.5px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--mute);
  padding-top:10px;
}
.idx{
  display:block;
  color:var(--ink);
  margin-bottom:8px;
  letter-spacing:.14em;
}

/* ---------- refusal / hero ---------- */
.refusal{padding:clamp(120px,17vh,190px) 0 clamp(64px,10vh,110px)}
.refusal h1{
  font-size:clamp(28px,4.6vw,52px);
  line-height:1.12;
  max-width:19ch;
  font-weight:200;
}
.lede{
  margin-top:clamp(24px,4vw,38px);
  max-width:56ch;
  color:var(--mute);
  font-size:clamp(15px,1.5vw,17px);
}
.limits{
  margin-top:14px;
  max-width:56ch;
  font-size:14px;
  color:var(--ink);
}
.cta{
  display:inline-block;
  margin-top:clamp(30px,5vw,46px);
  color:var(--accent);
  font-size:13px;
  letter-spacing:.14em;
  text-transform:uppercase;
  border-bottom:1px solid currentColor;
  padding-bottom:4px;
  transition:opacity .25s ease;
}
.cta:hover{opacity:.6}
.cta span{display:inline-block;transition:transform .25s ease}
.cta:hover span{transform:translateX(4px)}

/* ---------- accent rule ---------- */
.accent-rule{
  height:2px;
  background:var(--accent);
  width:100%;
}

/* ---------- indexed rows ---------- */
.rows{padding:clamp(60px,9vh,110px) 0 clamp(50px,8vh,96px)}
.rows__list{border-top:1px solid var(--hair)}
.row{
  display:grid;
  grid-template-columns:52px minmax(0,1fr) minmax(0,1.15fr);
  gap:clamp(14px,3vw,40px);
  align-items:baseline;
  padding:26px 0;
  border-bottom:1px solid var(--hair);
  opacity:0;
  transform:translateY(10px);
  transition:opacity .7s ease,transform .7s ease;
}
.row.is-in,.no-js .row{opacity:1;transform:none}
.row__n{
  font-size:11px;
  letter-spacing:.2em;
  color:var(--mute);
}
.row__t{font-size:clamp(17px,2vw,22px);line-height:1.25;font-weight:300}
.row__d{color:var(--mute);font-size:14.5px}

/* ---------- prices ---------- */
.prices{padding:clamp(40px,7vh,90px) 0 clamp(70px,11vh,130px)}
.prices__list{border-top:1px solid var(--hair)}
.price{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:baseline;
  gap:8px 28px;
  padding:20px 0;
  border-bottom:1px solid var(--hair);
}
.price__t{font-size:clamp(15px,1.7vw,18px);max-width:34ch}
.price__v{
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--mute);
  white-space:normal;
}
.prices__note{
  margin-top:22px;
  max-width:52ch;
  font-size:13.5px;
  color:var(--mute);
}

/* ---------- contact / footer ---------- */
.contact{
  border-top:1px solid var(--hair);
  padding:clamp(44px,7vh,76px) 0 clamp(44px,7vh,72px);
}
.contact__line{font-size:clamp(15px,1.7vw,18px);line-height:1.7}
.contact__line a{border-bottom:1px solid var(--hair)}
.contact__line a:hover{border-bottom-color:var(--ink)}
.contact__hours{margin-top:10px;color:var(--mute);font-size:14px}
.social{
  list-style:none;
  margin:26px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:12px 26px;
}
.social a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--mute);
  transition:color .25s ease;
}
.social a:hover{color:var(--ink)}
.contact__meta{
  margin-top:30px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 14px;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--mute);
}
.contact__meta a{border-bottom:1px solid var(--hair);padding-bottom:2px}
.contact__meta a:hover{color:var(--ink)}
.sep{width:24px;height:1px;background:var(--hair);display:inline-block}

/* ---------- legal page ---------- */
.legal{padding:clamp(110px,16vh,170px) 0 clamp(60px,9vh,110px)}
.legal h1{font-size:clamp(24px,3.4vw,38px);font-weight:200;margin-bottom:26px}
.legal h2{
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--mute);
  margin:30px 0 8px;
}
.legal__body p{max-width:62ch;color:var(--ink);font-size:15px}
.legal__body h1+p{color:var(--mute)}
.legal__body a{border-bottom:1px solid var(--hair)}
.legal__back{margin-top:40px}
.legal__back .cta{margin-top:0}

@media (max-width:760px){
  .grid{grid-template-columns:1fr;gap:18px}
  .label{padding-top:0}
  .idx{display:inline;margin-right:10px}
  .row{grid-template-columns:40px minmax(0,1fr);row-gap:8px}
  .row__d{grid-column:2/3}
  .refusal h1{max-width:none}
  .bar__nav{gap:14px}
  .bar__nav a{font-size:10px;letter-spacing:.12em}
}

@media (max-width:420px){
  .bar__nav a:nth-child(2){display:none}
}
